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
                        }       
                     });

（これは途中です.each()）

ただし、この関数は2回目のクリックでのみ実行されます。

誰かがこの奇妙なバグを追跡するのを手伝ってくれませんか、ありがとう

編集：コードブロック全体を追加しました。

    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

素晴らしい点.live()は、何度も呼び出す必要がないことです。あなたがしなければならないのはそれをから取り出すことです.each()。

クラスをセレクターとして使用しているため、そのクラスで作成する要素はすべて、クリックイベントに自動的にバインドされます。

于 2010-01-25T18:52:07.680 に答える
1

変数「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");
 }
});
于 2010-01-25T19:46:27.973 に答える
0

OK、問題が発生しました

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
  }

とにかくアリエルのおかげで、良い点です。

于 2010-01-25T19:44:23.850 に答える