2
セマンティックUI 2.1を使用していて問題があります。私は私のページに3つのスライダーチェックボックスを持っています。彼らはすべて同じクラスを持っており、一度にすべてを初期化できます。それぞれには、AJAX呼び出しでサーバーに送信する必要があるdata-*
属性が含まれています。セマンティックUIチェックボックスイベントがAJAXコール後にトリガーされない
は、ここで問題です:AJAX呼び出しが終了した後、初めて
、チェックボックスのためのイベントは機能しなくなります。私はイベントがDOMにバインドされていることを知っています。DOMの変更によって、更新されませんが、その周りには何か方法がありますか?
は、ここに私のページの非常にシンプルなバージョンです:
<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>
私はそれが動作しません怖いです。最初はうまくいきますが、ページをリロードした後にボタンは何もしません。 – VSG24
** .load()**メソッドでセレクタサフィックスの式を指定する必要がありますか? _ "接尾辞付きのセレクタ式を持たないURLを使用して.load()を呼び出すと、スクリプトが削除される前にコンテンツが.html()に渡され、スクリプトブロックが破棄される前に実行されます。 URLにセレクタ式を追加した状態で.load()が呼び出されますが、DOMが更新される前にスクリプトが取り除かれて実行されることはありません。 "_ http://api.jquery.com/load/ –
その '+ '#body''部分がなければ、それは混乱を招き、' body'を複製します。私はそのセレクタがURLの最後になければ、それが動作するだけでなく、#bodyも複製することを確認できます。要素 – VSG24