jQuery的事件不是射擊通過循環生成的元素

我有以下的代碼，我通過一個部分是顯示實力標題和強度總結渲染jQuery的事件不是射擊通過循環生成的元素

<div id="strengths" class="row"> 
    <% FR_STRENGTHS.each do |strength| %> 
    <div class="col-xs-12 col-sm-6 col-md-4"> 
     <div > 
     <h3 class="jobtitle text-center"> <%= strength[1]["title"] %></h3> 
     <div class="text-justify strength_summary"> 
      <p> <%= strength[1]["summary"] %></p> 
     </div> 
     </div> 
    </div> 
    <% end %> 
</div>

強項

詳細信息可在翻譯YML文件目的（我的代碼與上面的英語待處理參數相同）。我想隱藏力量摘要並在用戶使用Jquery懸停力量標題時顯示它，但我無法使其工作。

以下jQuery的傳播文件我已經使用這個JS代碼：

$(document).ready(function() { 
    $('#strengths').on("mouseenter", "h3", 
    function() { 
     $('.strength_summary').slideDown(); 
    }, 
    function() { 
     $('.strength_summary').slideUp(); 
    } 
); 
});

在我不使用類作爲「strength_summary」選擇，因爲我承擔所有部分將滑動會的工作認爲，任何情況下，徘徊在任何H3時下來？但是這是不可能的，所以... 感謝您的幫助！

來源

2017-06-05 Jerome Homer

的可能的複製[事件綁定的動態創建的元素？（https://stackoverflow.com/questions/203198/event-binding-on-dynamically-created-elements） – 0X0nosugar

您需要使用遍歷函數，以便您只在當前元素之後滑動DIV。另外，你不能給兩個函數.on();如果您希望在停止懸停時運行另一個函數，請綁定一個mouseleave事件。

$("#strengths").on({ 
    "mouseenter": function() { 
    $(this).next(".strength_summary").slideDown(); 
    }, 
    "mouseleave": function() { 
    $(this).next(".strength_summary").slideUp(); 
    } 
}, "h3");

來源

2017-06-05 16:30:26 Barmar

感謝Barmar，即作品！ –

jQuery的事件不是射擊通過循環生成的元素

回答

相關問題