JQuery Append и методы

У меня есть эта страница:JQuery Append и методы

<html> 
<head></head> 
<body> 

<div id="elem"></div> 
<button id="addElem">Add Element</button> 

<script src="jquery-1.9.1.js" type="text/javascript"></script> 

<script type="text/javascript"> 
    $(function() { 

     //add element to elem div 
     $("#addElem").click(function() { 
      $("#elem").append('<a id="test" href="#">this is a test</a><br />'); 
     }); 

     //remove added elements on click event 
     $("#test").on("click", function(){ 
      alert(12); 
     }); 

    }); 
</script> 

</body> 
</html>

Что она делает, это добавить ссылку, и я хотел бы быть в состоянии нажать на добавленную ссылку и отображать предупреждающее сообщение, но предупреждение не работает. Что мне не хватает?

источник

2013-05-01 mpora

возможно дубликат [.delegate() против .on()] (http://stackoverflow.com/questions/8359085/delegate-vs-on) Вы не используете правильный синтаксис для делегированных событий с .on. Ваше текущее использование идентично использованию '.click (function() {...' –

Не проблема здесь в том, что jquery работает * перед * элемент с #test даже доступен? – keithwyland

Изменить его ...

$("#elem").on("click", "#test", function(){ 
     alert(12); 
});

JQuery blog имеет большое объяснение этому.

$(elements).on(events [, selector] [, data] , handler);

Когда селектор предусмотрен, .on() похож на .delegate() в том, что она придает> делегированное обработчик события, отфильтрованный с помощью селектора. Когда селектор опущен или null> вызов выглядит как .bind(). Существует один двусмысленный случай: если аргумент данных является строкой,> вы должны указать либо селекторную строку, либо значение null, чтобы данные не ошибались как> селектор. Передайте объект для данных, и вам не придется беспокоиться о специальных случаях.

источник

2013-05-01 20:56:18

это не правильно js синтаксис, я верю Кроме того, не могли бы вы дать объяснение, почему он его исправил? –

@AlexanderKuzmin Пояснение добавлено, работал над редактированием, когда пришел ваш комментарий. –

У вас нет якоря для мероприятия. Поскольку у вас нет другой оболочки, добавить документ в том, что:

$(document).on("click", "#test", function(){ 
    alert(12); 
});

ПРИМЕЧАНИЕ: Это будет работать только на первый щелчок, как вы бы добавить несколько идентификаторов, которые будут дубликатами.

Лучший способ:

$("#addElem").click(function() { 
    $("#elem").append('<a class="test" href="#">this is a test</a><br />'); 
}); 
$(document).on("click", ".test", function(){ 
    alert(12); 
});

источник

2013-05-01 20:59:32

Вы можете прикрепить функцию к созданному элементу в момент ее создания:

$("#elem").append($('<a>', { 
    id: "test. 
    href: "#", 
    text: "this is a test", 
    click: function(e){ 
    e.preventDefault(); 
    alert(12); 
    }) 
).append($("<br>"));

источник

2013-05-01 21:04:01 oomlaut

JQuery Append и методы

ответ

Смежные вопросы