JavaScript - 所有onClick事件都不起作用？

好的，我正在做一個Facebook風格的聊天。但那並不重要。JavaScript - 所有onClick事件都不起作用？

尼斯和漂亮，對吧？那麼，有一個問題。注意以下行：

<div class="conversation EmperorCuzco" onclick="setActive('EmperorCuzco')">

查看onclick的屬性？那麼，它不工作。但是，我已經確認該功能本身可以工作。（如果你像在JavaScript中那樣運行它，它會像夢一樣運行）我已經進一步證實，通過用簡單的alert('blah')代替onclick值，函數不是問題，但這也不起作用。

那麼，怎麼了？我在猜測，JavaScript中的某些內容會使某些內容失效，但我完全不知道它會是什麼，也不知道如何解決它。我做了一些網絡搜索，但找不到任何有用的東西。

發生了什麼事？

來源

2012-06-22 Nathanael

看起來像jquery中的一些事件處理程序試圖ajax到一個不存在的資源（load.php） –

也許有一個錯誤導致編譯問題的文件的某處，這將停止代碼運行。你看到在JavaScript控制檯中的任何錯誤？ –

AJAX問題沒有這樣做 - 我有本地文件，只是不在jsFiddle。 :) – Nathanael

您的setActive函數被定義爲，其範圍在$(document).ready處理程序的範圍之內。將該函數移到該函數外部，以使其位於全局範圍內。

現在它看起來是這樣的：

$(document).ready(function() 
{ 
    // ... 
    function setActive(new_conversation) 
    { 
     // ... 
    } 
});

現在它改成：

$(document).ready(function() 
{ 
    // ... 
}); 

function setActive(new_conversation) 
{ 
    // ... 
}

真的不過，你應該將內容從交互分離，並綁定在你的腳本本身的事件處理程序。喜歡的東西：

// Refers to the last clicked conversation *button* 
// Initialize to empty jQuery object 
var $active_conversation = $([]); 

// Binding on #chat, targeting click events on .conversation_button children 
$("#chat").on("click", ".conversation_button", function() { 
    // Hide currently active conversation 
    $active_conversation.hide(); 
    $active_conversation.siblings('.conversation_button').removeClass("selected"); 

    // Set as currently active conversation button 
    // Note: this refers to the clicked <div class="conversation_button"> 
    var $this = $(this); 
    $active_conversation = $this.siblings('.conversation'); 

    // Show this conversation 
    $active_conversation.show(); 
    $this.removeClass("alert").addClass("selected"); 
});

這種方法的一些優點：

你並不需要爲不同的對話不同類別。通過在$active_conversation中存儲實際對話DOM元素（作爲jQuery對象），可以識別對話而無需任何額外的處理。
您可以使用conversation添加和刪除整個列表項目，而無需分配新的事件處理程序。在上面的示例中，的所有.conversation_button元素的事件處理程序定義在#chat的級別。有關此綁定機制的更多信息，請閱讀.on（或1.731之前的.delegate）。

在這裏，有一個updated fiddle！ :-)

來源

2012-06-22 17:52:22

或者使用jQuery來綁定事件，而不是使用內聯點擊處理程序。 –

我搬了這個功能，但沒有運氣。 http://jsfiddle.net/SkHme/5/ – Nathanael

啊，很美。 :)這看起來好多了，評論確實有幫助。非常感謝！ – Nathanael

如果你說的都是真的（嚴重的錯誤發生），可以使這個唯一的事情是，在其他事件處理程序，負責你的事件使用stopPropagation()或return false;

快速檢查之前可以做的是用onmousedown或onmouseup替換onclick，看看你的警報是否可見。

來源

2012-06-22 17:54:00

當然我所說的是真的。：P我嘗試了其他事件，但不幸的是他們也沒有解決它。 – Nathanael

JavaScript - 所有onClick事件都不起作用？

回答

相關問題