0

我有一个用 js 生成的 DOM 元素，因此当我想绑定一个单击事件侦听器时，我需要使用$(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
                        }       
                     });

（这是在 a 中间.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()

                    }
             });                                                        

        }
4

3 回答 3

1

看来需要从数据中提取变量“isTrunced”。由于它最初没有定义（在 live 函数内），它将默认为 false。

所以一旦你把 live 函数从每个循环中拉出来，试试这个：

$(".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");
 }
});
于 2010-01-25T19:46:27.973 回答
1

最棒的.live()是它不需要被多次调用。您所要做的就是将其从.each().

由于您使用类作为选择器，因此您将使用该类创建的任何元素都将自动绑定到 click 事件。

于 2010-01-25T18:52:07.680 回答
0

OK, i got the problem

the logic of the if was buggy.

This is the corrected:

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
  }

Anyway thanks to Ariel, good point.

于 2010-01-25T19:44:23.850 回答