jQuery .live ("click", fn) работает только по второму клику - PullRequest
Новая
       34

jQuery .live ("click", fn) работает только по второму клику

0 голосов
/ 25 января 2010

У меня есть элемент DOM, который генерируется с помощью js, и поэтому, когда я хочу связать прослушиватель событий щелчка, мне нужно использовать $(generatedEl).live("click", fn...) (есть ли другой способ?)

вот код, который я использую: 

$(".toggleView").live("click", function(){
                    if(isTrunced){
                        $(this).html(cntarctText).siblings("h3").html(currEl.data("md").myFullText)
                        isTrunced = false
                    }
                    else{
                        $(this).html(expandText).siblings("h3").html(currEl.data("md").truncedText)
                        isTrunced = true
                        }       
                     });

(это в середине .each())

Но функция запускается только при втором щелчке.

Может кто-нибудь помочь мне отследить эту странную ошибку, Спасибо

РЕДАКТИРОВАТЬ: Добавлен весь блок кода. 

    var truncMe = function(passedNode, passedChanges){
        var truncTarget = passedNode,
            expandText = "more",
            cntarctText = "less",
            isTooLong = false,
            isTrunced = false,
            maxChar = 170,
            toggleView


            truncTarget.each(function (index, domEle) {
            var currEl = $(domEle)


            currEl.data("md", {myFullText:currEl.html(),isTooLong:false, isTrunced:false })
                if(currEl.data("md").myFullText.length >= maxChar){
                    currEl.data("md").truncedText = currEl.data("md").myFullText.substring(0, maxChar);
                    currEl.data("md").isTooLong = true;
                    currEl.siblings(".toggleView").remove()
                    if(passedChanges){
                        currEl.data("md").myFullText = passedChanges;
                        currEl.data("md").truncedText = currEl.data("md").myFullText.substring(0, maxChar);
                    }
          /* here the element is created */
                    toggleView = $("<div class='toggleView'/>").html(expandText).appendTo(currEl.parent()); 
                    currEl.html(currEl.data("md").truncedText)
          /* here the event is binded */                        
$(".toggleView").live("click", function(){

                    if(isTrunced){
                        $(this).html(cntarctText).siblings("h3").html(currEl.data("md").myFullText)
                        isTrunced = false
                    }
                    else{
                        $(this).html(expandText).siblings("h3").html(currEl.data("md").truncedText)
                        isTrunced = true
                        }       
                     });        
                }
                else{
                    currEl.siblings(".toggleView").remove()

                    }
             });                                                        

        }

Ответы [ 3 ]

1 голос
/ 25 января 2010

Похоже, что переменная isTrunced должна быть извлечена из данных. Поскольку он не определен изначально (внутри живой функции), по умолчанию будет установлено значение false.

Так что, как только вы извлекаете живую функцию из каждого цикла, попробуйте это: 

$(".toggleView").live("click", function(){
 if($(this).data("isTrunced")){
  $(this).html(cntarctText).siblings("h3").html(currEl.data("md").myFullText)
  $(this).data("isTrunced", "false");
 } else {
  $(this).html(expandText).siblings("h3").html(currEl.data("md").truncedText)
  $(this).data("isTrunced", "true");
 }
});
1 голос
/ 25 января 2010

Самое замечательное в .live() заключается в том, что его не нужно вызывать более одного раза. Все, что вам нужно сделать, это взять его из .each().

Поскольку вы используете класс в качестве селектора, любой элемент, который вы создадите с этим классом, будет автоматически связан с событием click.

0 голосов
/ 25 января 2010

ОК, у меня проблема

логика if глючила.

Это исправлено: 

if(isTrunced){
  $(this).html(cntarctText).siblings("h3").html(currEl.data("md").myFullText)
  isTrunced = false
    }
else{
 $(this).html(expandText).siblings("h3").html(currEl.data("md").truncedText)
   isTrunced = true
  }

В любом случае, благодаря Ариэль , хорошая точка.

...