追加jQuery工作,但onclick不工作
Append jQuery working but onclick is not working
我有过滤器的产品类型,这是通过ajax创建的每个条目在数据库:
HTML部分:<ul id="foodtype"></ul>
显示过滤器的Ajax代码:
function showtypes(){
$.ajax({
type: "POST",
url: "ajax/incl/showtype",
data:'',
dataType : 'json',
cache: false,
success: function(records1){
$('#foodtype').html(makefoodType(records1));
}
});
}
function makefoodType(data1){
var tbl_body = "";
$.each(data1, function() {
var tbl_row = "",
currRecord = this;
$.each(this, function(k1 , v1) {
tbl_row += "<li><input type=checkbox id="+v1+" name="+v1+" />
<span style=font-size:14px>"+v1+"</span></li>";
})
tbl_body += tbl_row;
})
return tbl_body;
}
类别得到正确显示,但当我选择复选框然后下面的代码需要执行
function getFilterOptions(){
var opts = [d,de];
$checkboxes.each(function(){
if(this.checked){
opts.push(this.id);
}
return opts;
}
var $checkboxes = $("input:checkbox");
$checkboxes.on("change", function(){
var opts = getFilterOptions();
updateProducts(opts);
});
我想要复选框的ID被推到页面有php代码。但是在勾选复选框时什么也没有发生。注意:当我查看源代码,然后<ul id="foodtype"></ul>
代码保持不变。没有显示<li>
元素:
您需要使用事件委托。监听复选框所在的容器上的单击事件。因此,在动态添加它们之后,click事件将冒泡到容器中。
这是因为var $checkboxes = $("input:checkbox");
在ajax完成之前被执行,因此没有元素。
改变
$(document).on("change", "input:checkbox", function() {
var opts = getFilterOptions();
updateProducts(opts);
});
相关文章:
- xPages标签onclick事件不'不要在空白处工作
- 加载Soundcloud嵌入式播放器OnClick在FireFox中不工作
- JavaScript onclick在IE 9中工作两次,然后停止
- javascript()onclick隐藏元素-dos'我不在firefox工作
- onclick'放在JavaScript脚本中时无法工作
- jquery onclick if..否则如果..否则无法正常工作
- onClick按钮不工作javascript/php/jquery mobile
- 按钮onclick函数在jquery中无法正常工作
- javascript动态生成的带有onclick事件的表无法正常工作
- onclick适用于一个按钮,但不适用于'不要为别人工作
- $(这个)没有't在onClick事件中不再工作
- Javascript:onclick函数工作一次,页面就会恢复到原来的状态
- 玩.onclick停止工作
- React组件onClick处理程序不工作
- 正在尝试使用onclick事件提交父窗体,无法工作
- JavaScript img onclick 引用错误才能正常工作
- 不触发 OnClick 事件 IE8,但在 Firefox 中工作正常
- 在 XSLT 中通过 onclick 事件传递变量无法正常工作
- 它不工作"onclick"使用attr()从JQuery
- 搜索表单不工作'onclick&;