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

Question

好吧，所以我正在進行Facebook風格的聊天。 但這並不重要。

見這里： http ： //jsfiddle.net/SkHme/7/

很漂亮，對吧？ 好吧，有一個問題。 注意這一行：

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

查看onclick屬性？ 好吧，它不起作用。 但是，我已經確認該功能本身可以正常工作。 （如果你像在JavaScript中那樣運行它，它就像夢一樣運行）我已經進一步確認函數不是問題，試圖用簡單的alert('blah')替換onclick值alert('blah') ，但那並不是'也工作。

那么這是什么一回事？ 我猜測我的JavaScript中的某些內容會以某種方式禁用某些內容，但我完全不知道它可能是什么，也不知道如何修復它。 我做了一些網絡搜索，但找不到任何有用的東西。

這是怎么回事？

Answer 1

您的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 （或.delegate for 1.7之前版本）。

在這里，有一個更新的小提琴 ！ :-)

Answer 2

如果你說的都是真的（錯誤發生），唯一可以做到這一點的是另一個事件處理程序在使用stopPropagation()之前接受你的事件或return false;

可以執行的快速檢查是使用onmousedown或onmouseup替換onclick ，並查看警報是否可見。