Javascript AJAX调用后未触发语义UI复选框事件
我使用的是语义用户界面2.1，我遇到了一个问题。我的页面中有三个滑块复选框。它们都有相同的类，我可以一次初始化它们。它们都包含一个Javascript AJAX调用后未触发语义UI复选框事件,javascript,jquery,ajax,javascript-events,semantic-ui,Javascript,Jquery,Ajax,Javascript Events,Semantic Ui,我使用的是语义用户界面2.1，我遇到了一个问题。我的页面中有三个滑块复选框。它们都有相同的类，我可以一次初始化它们。它们都包含一个data-*属性，我需要通过AJAX调用将该属性发送到服务器 问题是： 在第一次完成AJAX调用后，复选框的事件不再起作用。我知道这些事件是绑定到DOM的，并且随着DOM的更改，它们不会更新，但是有什么办法吗 以下是我的页面的一个非常简单的版本： <html> <body id="body"> <!-- First Element --&
data-*<html>
<body id="body">
<!-- First Element -->
<div class="ui fitted slider checkbox comment">
<input data-status="0" type="checkbox"> <label></label>
</div>
<!-- Second Element -->
<div class="ui fitted slider checkbox comment">
<input data-status="2" type="checkbox"> <label></label>
</div>
<!-- Third Element -->
<div class="ui fitted slider checkbox comment">
<input data-status="3" type="checkbox"> <label></label>
</div>
<button class="button-action">Do Stuff</button>
</body>
<script>
$('.checkbox.comment').checkbox().checkbox({
onChecked: function () {
// This is only called before ajax reload, after ajax, it just won't
console.log("onChecked called");
},
onUnchecked: function () {
// This too is only called before ajax reload
console.log("onUnchecked called");
}
});
$(document).delegate('.button-action', 'click', function () {
$.ajax({
// Noraml ajax parameters
})
.done(function (data) {
if (data.success) {
// Reload
$('#body').load(document.URL + ' #body');
}
});
});
</script>
<html>
做事
$（'.checkbox.comment'）.checkbox（）.checkbox({
一旦检查：函数（）{
//这只在ajax重新加载之前调用，在ajax之后，它就不会调用了
log（“onChecked调用”）；
},
未检查：函数（）{
//这也仅在ajax重新加载之前调用
console.log（“未检查调用”）；
}
});
$（文档）.delegate（“.按钮操作”，“单击”，函数（）{
$.ajax({
//Noraml ajax参数
})
.完成（功能（数据）{
if（data.success）{
//重新装载
$（“#body'）.load（document.URL+”#body'）；
}
});
});
函数复选框\u eventlistener（）{
$（'.checkbox.comment'）.checkbox（）.checkbox({
一旦检查：函数（）{
//这只在ajax重新加载之前调用，在ajax之后，它就不会调用了
log（“onChecked调用”）；
},
未检查：函数（）{
//这也仅在ajax重新加载之前调用
console.log（“未检查调用”）；
}
});
}
$（文档）.delegate（“.按钮操作”，“单击”，函数（）{
$.ajax({
//Noraml ajax参数
})
.完成（功能（数据）{
if（data.success）{
//重新装载
$（“#body'）.load（document.URL+”#body'）；
复选框_eventlistener（）；
}
});
});
$（函数（）{
复选框_eventlistener（）；
})
做些事情bodyhtml（）load（）