Не срабатывает при использовании .on?

Question

Что я ожидаю здесь, это функция, которая срабатывает при щелчке по классу, но этого не происходит! A.button динамически создается, но IS на странице, когда он полностью загружен!

Любые идеи, почему?

HTML:

<a class="btn btn-success useImg"> 
      <i class="fa-icon-plus"></i> 
      <span>Use</span> 
    </a> 

Jquery:

$(".useImg").on("click", function(){ 
    alert("test"); 
    }); 

Answer 1

Вам нужно добавить событие щелчка к другому элементу дальше вверх по дереву DOM, а затем процеживают работать на вашем якорного элемента. Это будет срабатывать для любых элементов с классом .useImg, включая динамически добавленные.

$('body').on("click", ".useImg", function(){ 
    alert("test"); 
}); 

См http://api.jquery.com/on/

Убедитесь, что вы обернуть код в случае JQuery DOM Ready для обеспечения полной загрузки страницы. например

$(document).ready(function() { 
    $('body').on("click", ".useImg", function(){ 
     alert("test"); 
    }); 
}); 

Answer 2

Try, когда документ будет готов

$(function() { 
$(".useImg").on("click", function(){ 
    alert("test"); 
    }); 
} 

Answer 3

$(document).ready(
    $('.useImg').click(function(){ alert(test); }) 
) 

Answer 4

Ваш код отлично работает в автономном jsFiddle, который вы можете увидеть here.

Таким образом, вы должны иметь один из этих вопросов:

1. Вы пытаетесь установить обработчик события до того, как DOM готов или до того, как объект существует.
2. В вашем javascript есть ошибка, которая предотвращает установку обработчика события.
3. Фактический код на вашей странице или HTML не совпадает с тем, что вы задали в вопросе, так что есть другая проблема, которая не раскрывается.

Вы можете защитить от первого элемента, поставив свой код в обработчике $(document).ready() или с помощью делегированной обработки событий.

Для второго элемента вам необходимо проверить консоль ошибок браузера на наличие ошибок скрипта.

Answer 5

Попробуйте использовать $("body").on("click", ".useImg", function(){ alert("test"); });

и рекомендуется использовать последнюю версию JQuery LIB http://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js