Question

我的代码有问题。复选框选中/取消选中所有工作在首次加载时显示所有员工列表。但是，当我选择特定员工组的下拉列表时，它会显示所选的员工组，但复选框选中/取消选中所有员工不再工作。我在搜索一组员工时使用xmlhttprequest。请帮忙。我是所有代码的stackoverflow搜索者，但即使在互联网上搜索我也找不到合适的答案。

以下是我在下拉列表中的代码示例：

function searchStatus(str) {
document.getElementById("livesearch").innerHTML="";
$("#dvloader").show();
if (str.length==0) {
document.getElementById("livesearch").innerHTML="";
//document.getElementById("livesearch").style.border="0px";
$("#dvloader").hide();
return;
}
if (window.XMLHttpRequest) {
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
} else {  // code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function() {
if (xmlhttp.readyState==4 && xmlhttp.status==200) {
  document.getElementById("livesearch").innerHTML=xmlhttp.responseText;
  $("#dvloader").hide();
  //document.getElementById("livesearch").style.border="1px solid #A5ACB2";

    /// can add another function here
}
}

xmlhttp.open("GET","findStatus.php?employee="+str,true);
xmlhttp.send();

}

示例代码或程序将非常有用。非常感谢你提前。

这里是div＆＃34; livesearch＆＃34;看起来想要概述一下真正发生的事情：

<div id="livesearch" class="span12">

<?php
// SQL query
//$strSQL = "SELECT * FROM employees WHERE '$status' = '$status' ORDER BY emp_lname 
ASC";

//$employee = ucwords($employee);

            $strSQL =  "SELECT * ";
            $strSQL .= "FROM employees ";
            $strSQL .= "ORDER BY emp_lname ASC ";

            //In MySQL syntax ucase function is the same with the PHP's
            //ucase function

// Execute the query (the recordset $rs contains the result)
            $rs = mysql_query($strSQL);
            $num = 0;

            $rec_count = mysql_num_rows($rs);
            ?>
            <?php
            if($rec_count < 1){
            ?>
            <div class="alert alert-info">
        <button class="close" data-dismiss="alert" type="button"></button>
            <strong>Information: </strong>No results. Search again.
            </div>
            <?php
            } else {

            }

            ?>

<form class="" action="" method="post" enctype="multipart/form-data" name="selection">
<table align="center" class="table table-hover">
<thead>
<tr>
<th><input class="checkall" type="checkbox" value="" onclick="check();"/></th>
<th>Employee Number</th>
<th>First Name</th>
<th>Middle Name</th>
<th>Last Name</th>
<th>Status</th>
<th></th>
</tr>
</thead>
<tbody>
<?php


            // Loop the recordset $rs
            while($row = mysql_fetch_array($rs)) {
            $num++;
            ?>
<tr>
<td><input class="checkbox1" name="checkbox[]" id="checkbox[]" type="checkbox" 
value="<?php echo $row['emp_num'];?>"/></td>
<td><?php echo $row['emp_num'];?></td>
                        <td><?php echo $row['emp_fname'];?></td>
                        <td><?php echo $row['emp_mname'];?></td>
                        <td><?php echo $row['emp_lname'];?></td>
<td><?php echo $row['emp_status'];?></td>
<td><a href="basic.php?emp_num=<?php echo $row["emp_num"];?>">View Records</a></td>
                        </tr>
            <?php
            }
//<td><a href='basic.php?emp_num={$row["emp_num"]}'>View Records</a></td>
//<td><a href='basic.php?delete_emp={$row["emp_num"]}'>Delete Employee</a></td>
            ?>
</tbody>
</table>

</form>

</div>

Answer 1

问题是你正在处理动态元素，并且没有使用事件委托来处理这种情况。

因此，使用.on()的事件委托语法来处理动态元素

$(document).on('click', '.checkall', function () {
    $(this).closest('table').find(':checkbox').prop('checked', this.checked);
});

由于您已经在使用jQuery，因此无需使用XMLHttpRequest来执行ajax请求并担心浏览器可比性问题...使用jQuery.ajax()或在此情况下使用.load()像

这样的方法

function searchStatus(str) {
    var $live = $("#livesearch").empty();
    if (str.length == 0) {
        return;
    }
    $("#dvloader").show();
    $live.load("findStatus.php?employee=" + str, function () {
        $("#dvloader").hide();
    })
}

Event binding on dynamically created elements?

使用xmlhttprequest搜索后，复选框检查所有不工作

1 个答案: