[英]jQuery function not working after making an ajax call
页面ddlFilter
会有一个下拉列表ddlFilter
,还有一个复选框( divData
id为239)。 更改下拉列表的值将进行ajax调用,然后将divData
的内容替换为接收到的内容。 收到的内容是另一个复选框的HTML(例如ID 249)。
单击任何复选框后,应触发showProduct()
问题:最初在页面加载后,当我单击复选框239时,将触发showProduct
。 但是,在更改下拉列表并单击复选框249之后,不会触发该功能。
控制台中没有错误。 我认为事件处理未绑定到非常规添加的复选框。 我怎样才能解决这个问题。
ASPX:
<asp:dropdownlist id="ddlFilter" runat="server/>
<div id="divData">
<input type="checkbox" class="chkBx" id="239"> --line 1
<!--On changing the dropdown value, line 1 will be replaced by this.-->
<!--<input type="checkbox" class="chkBx" id="249">-->
</div>
JS:
$(document).ready(function(){
$("#ddlFilter").change(function(){
//code to make ajax call and bind new html inside divData
})
$(".chkBx").change(function(){
showProduct();
})
})
function showProduct(){
alert();
}
当您通过ajax替换DOM元素而不刷新时,事件不会自动附加。
你可能会用
$(document).on("change",".chkBx",function(){
showProduct();
});
尝试这个
$( "body" ).delegate( ".chkBx", "change", function() {
showProduct();
});
$( "body" ).on("change",".chkBx",function(){
showProduct();
});
我们使用Ajax来满足我们的要求而无需刷新页面。在您的示例中,您要更改下拉列表的值,然后单击任何值,但在这种情况下jquery事件无法与DOM元素绑定。因此您必须在更改时调用函数showProduct dropdowm值。 请在下面使用:
$(document).on("change",".chkBx",function(){
showProduct();
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.