私はJqueryと一緒です。
そのようなdivにhtmlを追加しました:
$('div#byletter').append(createLettersHtml());
createLettersHtml 関数は、すべて「div.ln-letters」でラップされた文字 (リンク) のリストを作成します。次に、次のような「onclick」イベントを呼び出します。
$('.ln-letters a').click(function(){
alert(123);
});
しかし、何も起こりません!追加されていないhtml要素でonclickを呼び出すと機能しますが、追加されたコンテンツでは機能しません。私は何を間違っていますか?
アップデート:
完全なコードは次のとおりです。
$(document).ready(function(){
$.fn.listnav = function(options) {
var opts = $.extend({}, $.fn.listnav.defaults, options);
var letters = ['_', 'a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', 'l', 'm', 'n', 'o', 'p', 'q', 'r', 's', 't', 'u', 'v', 'w', 'x', 'y', 'z', '-'];
var firstClick = false;
opts.prefixes = $.map(opts.prefixes, function(n) { return n.toLowerCase(); });
$('div#byletter').append(createLettersHtml());
function createLettersHtml() {
var html = [];
for (var i = 1; i < 27; i++) {
if (html.length == 0) html.push('<a class="all" href="#">ALL</a><a class="_" href="#">0-9</a>');
html.push('<a class="' + letters[i] + '" href="#">' + ((letters[i] == '-') ? '...' : letters[i].toUpperCase()) + '</a>');
}
return '<div class="ln-letters">' + html.join('') + '</div>' + ((opts.showCounts) ? '<div class="ln-letter-count" style="display:none; position:absolute; top:0; left:0; width:20px;">0</div>' : ''); // the styling for ln-letter-count is to give us a starting point for the element, which will be repositioned when made visible (ie, should not need to be styled by the user)
}
};
$.fn.listnav.defaults = {
initLetter: '',
includeAll: true,
incudeOther: false,
includeNums: true,
flagDisabled: true,
noMatchText: 'No matching entries',
showCounts: true,
cookieName: null,
onClick: null,
prefixes: []
};
$('.ln-letters a').click(function(){
alert(123);
});
});