Question

我已经搜索了几个小时，现在尝试实现脚本来更改div背景。我发现这个解决方案在不在循环中时有效：

Javascript: onClick checkbox change div color

这里的挑战是复选框位于具有唯一id值的foreach循环中。

这是我的代码：

<script language="JavaScript" type="text/JavaScript">
function myFunction(x, _this) {
  if (_this.checked) {
    x.style.backgroundColor = '#0000FF';
  } else  {
    x.style.backgroundColor = '#FF0000';
  }
}
</script>
<style type="text/css">
#result {
  background-color: #FF0000;
  padding: 7px;
  margin: 7px;
}
</style>
</head>

<body>
 <?php
    $SL = 0;
    foreach($results_resultat as $key => $row_resultat) { ?>
<div id="result">
  <input type="checkbox" name="res_id[]" value="<?php echo $row_resultat['id']; ?>" onChange="myFunction(result, this)">
</div>
<?php } ?>

使用此代码，它将显示从表格中选择的所有行，但在单击复选框时不会更改div颜色。

非常感谢帮助。： - ）

Answer 1

您使用相同的ID result来包装所有复选框元素。 id应该是唯一的，请使用class="result"来包装复选框元素。另外，您不必将this以外的任何内容发送到myFunction功能。因此，请按以下方式更改代码，

<强> CSS

.result {
    background-color: #FF0000;
    padding: 7px;
    margin: 7px;
}

<强> PHP

<?php
    $SL = 0;
    foreach($results_resultat as $key => $row_resultat) { ?>
        <div class="result">
            <input type="checkbox" name="res_id[]" value="<?php echo $row_resultat['id']; ?>" onChange="myFunction(this)">
        </div>
        <?php 
    } 
?>

<强>的JavaScript

function myFunction(_this) {
    if (_this.checked) {
        _this.parentElement.style.backgroundColor = '#0000FF';
    } else  {
        _this.parentElement.style.backgroundColor = '#FF0000';
    }
}

Answer 2

您的代码存在问题：r.Connect(); r.cmd = new MySqlCommand("SELECT COUNT (*) FROM tblsection WHERE SchoolYear = @SchoolYear AND GradeLevel = @GradeLevel AND Section = @Section ",r.con); r.cmd.Parameters.AddWithValue("@SchoolYear", cbSchoolYear.Text); r.cmd.Parameters.AddWithValue("@GradeLevel", cbGradeLevel.Text); r.cmd.Parameters.AddWithValue("@Section",txtSectionName.Text); int UserExist = (int)r.cmd.ExecuteScalar(); if (UserExist > 0) { MessageBox.Show("Section Already Exist"); r.Disconnect(); }行。在该行没有定义结果，通常传递带有选择器的字符串或带有id的字符串。像onChange="myFunction(result, this)"

这样的东西

然后在你onChange="myFunction('result', this)"函数中使用JS来获取对DOM元素的引用。

document.getElementById

更改DIV颜色复选框onclick IN LOOP

2 个答案: