Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате
Форум программистов > JavaScript: Применение библиотек > Jquery не слышит событие


Автор: Areostar 20.7.2013, 20:20
имеется небольшой скрипт:

Код

$(document).ready(function(e)
 { 
    var interval = false;
    function timer() 
    {
        var monthString; 
        var dayString;
                
        var tempData = new Date();
      
        var fullYear = tempData.getFullYear();
        var currentMonth = tempData.getMonth();
        var currentDate = tempData.getDate();
        var currentDay = tempData.getDay();
      
        var currentHours = tempData.getHours();
        var currentMinutes = tempData.getMinutes();
        var currentSeconds = tempData.getSeconds();
      
        if(currentMonth == 0) {  monthString = " January";  }
        if(currentMonth == 1) {  monthString = " February";  }
        if(currentMonth == 2) {  monthString = " March";  }
        if(currentMonth == 3) {  monthString = " April";  }
        if(currentMonth == 4) {  monthString = " May";  }
        if(currentMonth == 5) {  monthString = " June";  }
        if(currentMonth == 6) {  monthString = " July";  }
        if(currentMonth == 7) {  monthString = " August";  }
        if(currentMonth == 8) {  monthString = " September";  }
        if(currentMonth == 9) {  monthString = " October";  }
        if(currentMonth == 10) {  monthString = " November";  }
        if(currentMonth == 11) {  monthString = " December";  }
      
        if(currentDay == "0") {  dayString = " Monday  ";  }
        if(currentDay == "1") {  dayString = " Tuesday  ";  }
        if(currentDay == "2") {  dayString = " Wednesday  ";  }
        if(currentDay == "3") {  dayString = " Thursday  ";  }
        if(currentDay == "4") {  dayString = " Friday  ";  }
        if(currentDay == "5") {  dayString = " Saturday  ";  }
        if(currentDay == "6") {  dayString = " Sunday  ";  }
          
        if(currentSeconds < 10) {  currentSeconds = "0" + currentSeconds;  }
        if(currentMinutes < 10) {  currentMinutes = "0" + currentMinutes;  }
        if(currentHours < 10) {  currentHours = "0" + currentHours;  }
      
        var dataString = "<p> year " +fullYear +" "+  currentDate + " of" + monthString + "  " + dayString + currentHours + ":" + currentMinutes + ":" + currentSeconds + "</p>";
        var versionString = "<p>MagicList version 0.1 July 3013</p>";
        var authorString = "<p>Written by Shtihov Anton</p>";
          
        $(".data_time").html("<table><tr><td>"+ dataString +"</td><td>"+ versionString +"</td><td>"+ authorString +"</td></tr></table>");
        $(".topMenu").html("<table><tr><td id='simple'>Simple List</td><td id='statistic'>Statistic List</td><td id='diagramm'>Diagram List</td></tr></table>");
    }
    
    $("#simple").click(function(){
        alert("ALERT!!!!");
    });
    
    $(window).load(function(){
        if(!interval)
            interval = setInterval(timer, 1000);
    }); 
 });

Внем вывожк страницу первый див с чисами датой и прочей инфой - тут всё впорятке

второй див с простой таблицей - тоже появляется

По вот пытаюсь приципить слушатель на клик по одной из ячеек:

Код

$("#simple").click(function(){
        alert("ALERT!!!!");
    });


Не работает. и не могу понять почему?

Автор: Amphiluke 20.7.2013, 21:16
Не работает потому, что обработчики событий можно добавлять только к элементам, которые уже присутствуют в документе на момент регистрации обработчика. В вашем случае это не так (таблица создается позже, динамически).
В вашем случае подойдет прием делегирования обработки событий родительскому элементу, который статически присутствует в документе. Например:
Код

$(".topMenu").on("click", "#simple", function () {
    alert("ALERT");
});


Этот ответ добавлен с нового Винграда - http://ru.vingrad.com//object-id51eac7036ccc190550000002#findElement_E7045_51ead3e86ccc19ae4a00105c_0

Powered by Invision Power Board (http://www.invisionboard.com)
© Invision Power Services (http://www.invisionpower.com)