复选框不工作后ajax调用php


checkboxes not working after ajax call php

我在我的网页上有一些复选框,我正在实现ajax调用,我正在更新div中的内容,我正在刷新复选框中列出的项目的计数,就像电子商务网站过滤器一样。但在第一次勾选复选框之后。Ajax调用工作。但是当我再次打勾的时候。未执行Ajax请求。

请检查以下代码

<input type="checkbox" name="item1" id="item1" value="item1">item1[5]<br />
<input type="checkbox" name="item1" id="item2" value="item2">item1[3]<br />
<input type="checkbox" name="item1" id="item3" value="item3">item1[6]<br />
<input type="checkbox" name="item1" id="item4" value="item4">item1[3]<br />
ajax调用

$(document).ready(function(){
   checkboxValidate = function (e) {
   if(e)e.preventDefault();
    $.ajax({
            type: 'get',
            async:false,
            cache:false,
            url: 'getmoredata.php',
            data: {data1:data1},
            success: function(data){                
                $(data).appendTo('.container');
                console.log(data);
            },      
                error: function(data){
                alert("ajax error occured…"+data);
            },
            timeout:5000
        }).done(function(){
        //alert(timeout);
            $("#loading").fadeOut("slow");
            $(window).bind("scroll",function(){
            scrollMore();   
        });
        });
}
}
<div id="container">
<div id="div1">
</div>
</div>
$( "[type=checkbox]" ).change(checkboxValidate);

ajax调用正在刷新的内容后

我正在getmoredata.php中执行SQL查询,我正在获得刷新的复选框值和它们的计数。

$sql=select DISTINCT colname from tablename where colname='value coming from ajax call' group by colname
$sql=select count(colname) from tablename where colname='value from ajax call' group by colname.

然后我将第一个查询的值放入数组中。第二个查询给了我们count所以我在每个复选框中显示的count是动态的

then with foreach循环我正在刷新上面列出的复选框内容

<?php
foreach($arrayquery as $array)
{
?>
<input type="checkbox" value="<?php echo $array['colname'] ?>"><?php echo $array['colname'] 
}
?>

恐怕我没有在上面的复选框行添加复选框,是因为我的复选框没有被选中吗?请看一下……ajax调用后,无论我得到什么数据都会添加到容器div中,复选框内容也会在ajax调用后刷新。例如,前两个复选框项的初始计数为5和3,可以更改为10或12或其他东西,这取决于ajax调用后我们获得的数据。

现在的问题是,当我做了我的第一个ajax调用,并刷新div,之后,当我选中任何复选框,ajax调用不做,事实上没有发生在页面上。它保持静止不变。请检查这一点并帮助我。如有疑问,请澄清提前感谢

使用.on()方法将更改侦听器应用于文档

$(document).on('change', 'input[type="checkbox"]', checkboxValidate);
http://api.jquery.com/on/

希望这对你有帮助!

当前事件侦听器$( "[type=checkbox]" ).change仅绑定到页面加载时dom中存在的复选框。相反,使用.on()函数绑定到动态dom元素

$(document).on("change", ":checkbox", function(){
    //your ajax
}