點擊不會觸發jquery功能

Question

我有一個link_to '#'內div應該觸發淡入淡出的表單，點擊。

<div id="atendees-wrap"> 

    <%= f.simple_fields_for :atendees do |a| %> 

    <div class="expandable-members"> 
     <%= link_to 'Membrul', '#', class: 'trigger' %> 
    </div> 

    <div id="primary-info"></div> 
    <div id="secondary-info"></div> 

    <% end %> 
</div> 

問題是，它不會事件進入函數。 這裏的js代碼：

//= require jquery 
//= require jquery_ujs 

$(document).ready(function(){ 

    $('#atendees-wrap').find('.expandable-members').click(function() { 
    debugger 
    $('#primary-info, #secondary-info').fadeIn("slow"); 
    }); 

}) 

也是一樣的：

$('input[name*="agree"]').click(function() { 
    if ($(this).is(':checked')) { 
    console.log("clicked"); 
    $('input[type="submit"]').removeAttr('disabled'); 
    } else { 
    $('input[type="submit"]').attr('disabled', 'disabled'); 
    } 
}); 

我試着用mouseup和on("click", function(){})，但同樣的結果。

那麼我在這裏做錯了什麼？

Answer 1

請嘗試以下代碼。 href使用'javascript:;'而不是'＃'。

<div id="atendees-wrap"> 

    <%= f.simple_fields_for :atendees do |a| %> 

    <div class="expandable-members"> 
     <%= link_to 'Membrul', 'javascript:;', class: 'trigger' %> 
    </div> 

    <div id="primary-info"></div> 
    <div id="secondary-info"></div> 

    <% end %> 
</div> 

而且

//= require jquery 
//= require jquery_ujs 

$(document).ready(function(){ 

    $('#atendees-wrap .expandable-members').click(function() { 
    $('#primary-info, #secondary-info').fadeIn("slow"); 
    }); 

}) 

而且我無法找到輸入標籤在可以通過切換到發佈

Answer 2

我固定它的代碼此選擇$('input[name*="agree"]')這個選擇匹配：

$(document).on('click', '#atendees-wrap .expandable-members', function (e) { 
    e.preventDefault() 
    $('#primary-info, #secondary-info').slideToggle("slow"); 
});