Почему тег привязки, сгенерированный с помощью JQuery, не запускает событие onclick?

Question

Я динамически генерирую тег привязки, используя jQuery. Я добавил к нему атрибут onclick, но когда я нажимаю на ссылку, onclick не срабатывает.

Я создаю ссылку следующим образом:

$(document).ready(function() {

    var attributes = {
        "id": "xxx",
        "onclick": "alert('xxxx');",
        "href": "https://localhost/widget/TabTest.aspx#"
    };
    var link = $.create("a", attributes);
    $(link).append("xxxx");
    $("#WidgetContainer").append(link);
});

Answer 1

Установите атрибут click с помощью функции jQuery click ().

var attributes = {
     "id": "xxx",
     "href": "https://localhost/widget/TabTest.aspx#"
 };
 var link = $.create("a", attributes);
 $(link).append("xxxx").click(function(){ alert("HELLO"); });
 $("#WidgetContainer").append(link);

То, что вы сделали, скорее всего, будет работать в некоторых браузерах, но не в других (у меня это работало в FF, но не в IE). Обычно, если в jQuery есть функция для выполнения чего-либо, используйте ее.

<ч /> РЕДАКТИРОВАТЬ: В ответ на комментарий Адама Бэкстрома по вопросу, который я решил, я бы лучше предложил альтернативу. Когда я делал это в прошлом, я делал это так:

$("#someplace").wrapInner("<a href='#'></a>");
$("#someplace a").click(function() {
    alert("Hello");
});

<ч /> РЕДАКТИРОВАТЬ 2: Из комментариев к этому посту, как это сделать в одну строку (не всегда в лучшей идее):

$("<a id='xxx' href='https://localhost/widget/TabTest.aspx#'>xxxx</a>")
      .click(function() { alert("Hello"); })
      .appendTo($("#WidgetContainer"));

Answer 2

Если вы используете jQuery 1.3 или выше, вы можете использовать привязку «живого» события, чтобы прикрепить событие click к любым тегам , которые вы добавляете на свою страницу. E.g.:

$('a').live('click', function (evt) {
    alert('Hello');
    evt.preventDefault();
});
var link = $.create('a', {
    'id' : 'xxx',
    'href' : 'http://localhost/'
});
$('#container').append(link);