Rails和JQuery - 無法禁用鏈接默認操作

Question

我有一個「已檢查」鏈接，它將跳轉到相同的名稱控制器操作。它的路由作爲POST請求。我建立了代碼，但最新發生的是jquery $ .post被激發，但是html請求也發生，這意味着我的動作被調用了兩次。我無法弄清楚爲什麼。任何人都可以發現我犯的錯誤嗎？

在我的application.js

jQuery.ajaxSetup({ 
    'beforeSend': function(xhr) {xhr.setRequestHeader("Accept", "text/javascript")} 
}); 

$(document).ready(function() { 
$('ul li.sentence_summary a.correct').click(function(){ 
     $(this).css("border", "1px black solid"); 
     $.post($(this).attr("href"), null, null, "script"); 
     return false; 
    }); 

}); 

在我的控制器

def check 
    @sentence_author = User.find(params[:user_id]) 
    @sentence = @sentence_author.sentences.find(params[:id]) 
    @sentence.checked_at = Time.now 
    @sentence.checker_id = current_user.id 
    respond_to do |format| 
     if @sentence.save! 
     flash[:notice] = "Thank you for checking #{@sentence_author.to_s}s sentence." 
     format.js { } 
     format.html { redirect_to user_foreign_sentences_path(current_user, :display => :pending) } 
     format.xml { head :ok } 
     end 
    end 
    end 

，並在行動JS文件

alert("testing123"); 

UPDATE

我的視圖使用此部分呈現句子的集合。反過來部分調用如下所示呈現鏈接

%li{:id => ["sentence", "#{sentence.id}"], :class => "sentence_summary bottom_border_light"} 
    %div.left 
    = thumbnail_link_to_user_profile(sentence.user, User::GRAVATAR_M) 
    %div.left.main_info_container 
    %div 
     = link_to_user_profile(sentence.user) 
     = t('sentences.table.wrote') 
    %div.main_focus 

     = sentence.text 
    %div.bottom_bar 
     %div.left 
     = created_at_linked_to_sentence_show_path(sentence) 
     %div.right.rollover_options 
     = render_check_options(sentence) 
     = render_edit_options(sentence) 
     = render_flag(sentence) 
     %div.clear 
    %div.clear 

視圖助手方法，這幫助使問題

def render_check_options(sentence) 
    if sentence.user != current_user and sentence.language == current_user.native_language and sentence.pending? 
     html = link_to("correct", check_user_sentence_path(sentence.user, sentence), :method => "post", :class => "action_options underline_on_hover always_blue correct") 
     html += link_to("incorrect", new_sentence_correction_path(sentence), :class => "action_options underline_on_hover always_blue incorrect") 
     return html 
    end 
    end 

更新2 * 的聯繫，每繼承人發生了什麼東尼斯建議在我的螢火蟲控制檯

console.debug($('ul li.sentence_summary a.correct')); 

按預期輸出正確的鏈接（我點擊這些和他們到正確的HTML）

[a.action_options /users/9...24/check, a.action_options /users/2...26/check, a.action_options /users/2...27/check, a.action_options /users/9...28/check, a.action_options /users/1.../8/check, a.action_options /users/2...10/check, a.action_options /users/1...11/check, a.action_options /users/9...12/check] 

但即使在運行鏈接不會被禁用

以下兩條命令後

$('ul li.sentence_summary a.correct').unbind('click'); 


    $('ul li.sentence_summary a.correct').click(function(){ 
      return false; 
     }); 

我的HTML看起來像這樣第一個立在UL（注意鏈接問題是隱藏的，除非rollovered因此乳清有顯示器設置爲：這裏隱藏）

 <div class="left"> 
      <a href="https://stackoverflow.com/users/9"><img alt="D03e17968fe80cd2d3816e86a7e072f9" class="avatar" src="http://gravatar.com/avatar/d03e17968fe80cd2d3816e86a7e072f9.png?d=identicon&amp;r=PG&amp;s=45"></a> 
     </div> 
     <div class="left main_info_container"> 
      <div> 
      <a href="https://stackoverflow.com/users/9" class="user_name_link underline_on_hover always_blue">maxwell.wiegand</a> 
      wrote 
      </div> 
      <div class="main_focus"> 
      Aspernatur eum tenetur dolorem impedit dolor modi illum. 
      </div> 
      <div class="bottom_bar"> 
      <div class="left"> 
       <a href="https://stackoverflow.com/users/9/sentences/24" class="meta-data underline_on_hover">2 days ago</a> 
      </div> 
      <div style="display: none;" class="right rollover_options"> 
       <a href="https://stackoverflow.com/users/9/sentences/24/check" class="action_options underline_on_hover always_blue correct" onclick="var f = document.createElement('form'); f.style.display = 'none'; this.parentNode.appendChild(f); f.method = 'POST'; f.action = this.href;var m = document.createElement('input'); m.setAttribute('type', 'hidden'); m.setAttribute('name', '_method'); m.setAttribute('value', 'post'); f.appendChild(m);var s = document.createElement('input'); s.setAttribute('type', 'hidden'); s.setAttribute('name', 'authenticity_token'); s.setAttribute('value', 'ZD3boP6x3HjxzvLBQmTsJT2xCWGQoq8j7M0ZSD6UGbE='); f.appendChild(s);f.submit();return false;">correct</a><a href="/sentences/24/corrections/new" class="action_options underline_on_hover always_blue incorrect">incorrect</a> 

       <a href="/sentences/24/flags/new" class="action_options underline_on_hover always_blue">flag</a> 
      </div> 
      <div class="clear"></div> 
      </div> 
     </div> 
     <div class="clear"></div> 

Answer 1

嘗試刪除

$(this).css("border", "1px black solid"); 
     $.post($(this).attr("href"), null, null, "script"); 

剛剛返回false，告訴我發生了什麼

更新

如果您設置一個鏈接的onclick返回false，它應該無處可去。我會檢查兩件事 -

1）確保選擇器正確： 當你這樣做時，輸出是什麼？

console.debug($('ul li.sentence_summary a.correct')); 

2）確保沒有其他點擊處理程序的干擾： 已籤＃1後，打開你的JS控制檯，並做到：

$('ul li.sentence_summary a.correct').unbind('click'); 

這將解除綁定所有點擊事件，包括一個你想要發生。然後通過在控制檯中執行常用代碼重新綁定單擊事件（只在click處理程序中返回false）。這將確保只有一個處理程序監聽鏈接的單擊事件，並且一個處理程序將返回false並且不執行鏈接。

3）發表有關生成的HTML，所以我們可以看看

Answer 2

html = link_to("correct", check_user_sentence_path(sentence.user, sentence), :method => "post", :class => "action_options underline_on_hover always_blue correct") 

的:method => "post"可能是您在此處的問題的根源。這告訴Rails建立一個表單來提交，這意味着你的return false;沒有做你認爲它正在做的事情。

Answer 3

我想試試這個：

$('ul li.sentence_summary a.correct').click(function(e){ 
     e.preventDefault(); 
     $(this).css("border", "1px black solid"); 
     $.post($(this).attr("href"), null, null, "script"); 
    });