私は自分のサイトをAJAXify AJAXに教えています。テンプレートには、ビューからJSONデータを取得してdivに追加する次のJSコードがあります。
function filter(type) {
$.getJSON(
'/activity_stream/global-activity-stream/',
{xhr: "true", filter: type},
function(data) {
$('.mainContent').children().remove();
$(data).appendTo('.mainContent');
});
}
$(".btn").click(function () {
filter("recent");
});
}
私のビューは適切なJSONを返していると思いますが、データは.mainContent
divに追加されていません。
このエラーが発生します:
不明なTypeError:未定義のプロパティ 'ownerDocument'を読み取ることができません。
何らかの形式のデータではなく、セレクターをjQueryに渡していることを確認してください。
$( '.my-selector' )
ではない:
$( [ 'my-data' ] )
同様の問題がありました。私はjQuery.mapを使用していましたが、最後にjQuery.map(...)。get()を使用して通常の配列を操作するのを忘れていました。
$elms.each()
内で同じ問題が発生しました。
なぜなら:
.each(Function)
に渡す関数は、(少なくとも)2つの引数を公開します。最初はインデックスであり、2番目はリスト内の現在の要素の要素であり、あなたはこれをやろうと思うかもしれません:
$elms.each((item) => $(item).addClass('wrong'));
これが必要な場合:
$elms.each((index, item) => $(item).addClass('wrong'));
DOMに追加する場合、コンテンツに互換性があることを確認してください。
modal.find ('div.modal-body').append (content) // check content
ES6 anon関数を使用すると、$(this)
と競合します
これは動作します:
$('.dna-list').on('click', '.card', function(e) {
console.log($(this));
});
これは機能しません:
$('.dna-list').on('click', '.card', (e) => {
console.log($(this));
});