在運行時創建的跨度在腳本無法正常工作的情況下在mvc中正確運行

我有一個MVC項目，在BusinessPosition.cshtml中，我在運行時創建了一個樹視圖。通過在頁面加載默認情況下它會顯示根node.like的主要子，在運行時創建的跨度在腳本無法正常工作的情況下在mvc中正確運行

<ul class="col-lg-20 col-sm-12 col-xs-12" style="margin-left:20px"> 

    @foreach (var i in Model) 
    { 
     if(i.ChildCount<3) 
     { 

    <li class="Limenu" data-placement="right" data-toggle="tooltip" title="Childs"> 

     <span class="collapse collapsible" data-loaded="false" id="@i.ConsumerNo_">&nbsp;</span> 
     <span class="LessMenuspan btn-primary" id="@i.ConsumerNo_" style="border-radius:10px" data-toggle="modal" data-target="#ConsumerInfo"><strong class="btn btn-xs" >@i.ConsumerNo_</strong></span><br /> 

    </li> 
     } 
     else{ 

    <li class="Limenu" data-placement="right" data-toggle="tooltip" title="Childs"> 

     <span class="collapse collapsible" data-loaded="false" id="@i.ConsumerNo_">&nbsp;</span> 
     <span class="Menuspan btn-primary" id="@i.ConsumerNo_" style="border-radius:10px" data-toggle="modal" data-target="#ConsumerInfo"><strong class="btn btn-xs" >@i.ConsumerNo_</strong></span><br /> 

    </li> 
     } 

    } 

</ul>

我用<span>標籤來顯示它。現在我想在用戶點擊該範圍時顯示模式彈出。主要有兩個班，一個是'Menuspan'，另一個是'LessMenuspan'。我寫了一個腳本代碼，如

$('.Menuspan').click(function() { 
    var this1 = $(this).attr("id"); 

    alert(this1); 
}); 

$('.LessMenuspan').click(function() { 
    var this3 = $(this).attr("id"); 
    alert(this3); 

});

在頁面加載時，它會在我單擊時觸發警報。罰款，但在劇本我寫的代碼一樣

$.each(d, function (i, ele) { 
    if (ele.ChildCount < 3) { 

     $ul.append(
     $("<li></li>", { "id": 'treeLi' }).append(

      "<span class='collapse collapsible' data-loaded='false' pid='" + ele.ConsumerNo_ + "'>&nbsp;</span>" + 
      "<span class='LessMenuspan btn-primary' pid='" + ele.ConsumerNo_ + "' data-toggle='modal' data-target='#ConsumerInfo' ><strong class='btn btn-xs' >" + ele.ConsumerNo_ + "</strong></span>" 

      ) 
     ) 
    } 
    else { 
     $ul.append(
     $("<li></li>", { "id": 'treeLi' }).append(

      "<span class='collapse collapsible' data-loaded='false' pid='" + ele.ConsumerNo_ + "'>&nbsp;</span>" + 
      "<span class='Menuspan btn-primary' id='" + ele.ConsumerNo_ + "' data-toggle='modal' data-target='#ConsumerInfo'><strong class='btn btn-xs' >" + ele.ConsumerNo_ + "</strong></span>" 

      ) 
    ) 
    } 

});

現在，運行時創建的跨度不工作，因爲當我展開樹和新的孩子們產生（腳本span標記）。其中有兩類（如上所述）。但是當我點擊新的時候，屏幕上不會出現任何警報。請告訴我這裏有什麼問題。

來源

2016-01-20 Rahul Chaudhari

使用'.on'來綁定點擊事件。像'$（document）.on（「click」，「。Menuspan」，function（）{// do stuff}）;' –

您必須使用delegate事件綁定。 .click不適用於動態添加的元素/只適用於已在DOM中的元素。

使用

$(document).on("click",".Menuspan",function() { 
//do stuff 
});

來源

2016-01-20 08:23:38

yee ... urd老大......問題解決了.... –

是的。 .i給了我..那麼我的.. –

當您運行的JavaScript綁定到DOM，因爲它存在於那個時候。因此新元素不會在DOM中產生事件。

將其更改爲像這樣的事件會將事件綁定到現有元素，但會觸發任何子元素。

$(document).on('click', '.Menuspan', function() { 
    var this1 = $(this).attr("id"); 

    alert(this1); 
});

你可以將它綁定到UL元素，而不是文檔，如果你給一個ID。

來源

2016-01-20 08:23:40 samjudson

thanx ... nw它正在工作.... –

在運行時創建的跨度在腳本無法正常工作的情況下在mvc中正確運行

回答

相關問題