php - 选中时更改包含复选框属性的 div

Question

这是我的 JavaScript，允许过滤搜索字段...

function escape4regex(text)
{
  return text.replace(/[-[\]{}()*+?.,\\^$|#\s]/g, "\\$&");
}

function searchRegExFieldKeyUp()
{
    var table = document.getElementById('ModelFilter');
    var cells = table.getElementsByTagName('div');
    var searchterms = escape4regex(this.value);

    var regVar = '(?=.*' + searchterms.replace(/\s/g, '.*)(?=.*') + '.*)';
    var i=cells.length;
    while (i--)
    {
       var cell = cells[i];

       var rowStr = cell.innerHTML;
       // remove all tags
      rowStr = rowStr.replace(/<(?:.|\n)*?>/gm, '').replace(/\n|\s{2,}/gm, ' '); // searches  whole row 

      var regex = new RegExp(regVar,"gi");
      var result = (regex.test(rowStr));

     if(result)
     {
        cell.style.display = "";// check if compat with IE
     }
     else
     {
       cell.style.display = "none";
     }
   }
} 

这会根据数据库输入创建复选框

<div id="ModelFilter">
<?php 
while ($row = mysqli_fetch_assoc($result))
{
    echo"<div class=\"modelfilter_td\" id=\"modelfilter_td\">";
        echo"<input type=\"checkbox\" id = \"$row[ModelID]\" 
            name = \"selectedModels[]\"value =\"$row[Model]\" onclick=\"chkcontrol.apply(this);\">";
        echo "$row[Model]";
    echo"</div>";
}
echo"</div>";

我想做以下事情:

1. 选中该复选框后，即使它不在过滤器字段的搜索词中，它也会保持可见。

2. 当选中该复选框时，背景颜色会更改。

3. 复选框和复选框的标题保存在 div 中，我希望允许用户单击 div 中的任意位置以允许切换复选框。

有人能用这个让我走上正确的轨道吗？

编辑:这是问题“3”的解决方案。

<script language="javascript">
$(document).ready(function(){
$(".modelfilter_td").click(function(e){
    var chk = $($(this).find("input[type='checkbox']"));
    if(chk.attr('checked'))
    {
        chk.attr('checked',false);
    }else{
        chk.attr('checked',true);
    }

   });
});

Answer 1

这不是您问题的解决方案，而是关于 html 上下文中 php-usage 的建议:

<div id="ModelFilter">
    <?php while ($row = mysqli_fetch_assoc($result)): ?>
    <div class="modelfilter_td" id="modelfilter_td">
        <input  
            type="checkbox"
            id="<?php echo $row['ModelID'] ?>" 
            name="selectedModels[]"
            value="<?php echo $row['Model'] ?>"
            onclick="chkcontrol.apply(this);"
        >
        <?php echo $row['Model'] ?>
    </div>
    <?php endwhile ?>
</div>

这使得大多数 IDE 能够处理 HTML 自动完成和代码分析。