1

好的，所以我正在进行 Facebook 式聊天。但这并不重要。

见这里：http: //jsfiddle.net/SkHme/7/

漂亮又漂亮，对吧？嗯，有问题。注意这一行：

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

看到onclick属性了吗？好吧，它不工作。但是，我已经确认该功能本身确实有效。onclick（如果您像在 JavaScript 中那样运行它，它会像梦一样运行）我通过尝试将值替换为 simple进一步确认该函数不是问题alert('blah')，但这也不起作用。

那么这是什么一回事？我猜我的 JavaScript 中的某些东西以某种方式禁用了某些东西，但我完全不知道它可能是什么，也不知道如何修复它。我做了一些网络搜索，但找不到任何有用的东西。

这是怎么回事？

4

2 回答 2

3

您的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");
});

这种方法的一些优点：

  • 不同的对话不需要不同的课程。通过将实际对话 DOM 元素（作为 jQuery 对象）存储在 中$active_conversation，无需任何额外处理即可识别对话。
  • 您可以使用 a 添加和删除整个列表项，conversation而无需分配新的事件处理程序。在上面的示例中，所有 元素的事件处理程序都.conversation_button定义在#chat. 有关此绑定机制的更多信息，请继续阅读.on（或.delegate1.7 之前的版本）。

在这里，有一个更新的小提琴！:-)

于 2012-06-22T17:52:22.243 回答
0

如果您所说的一切都是真的（发生了严重错误），那么唯一可以做到这一点的是另一个事件处理程序在使用之前获取您的事件stopPropagation()或return false;

可以做的快速检查是onclick用onmousedownor替换onmouseup，看看你的警报是否变得可见。

于 2012-06-22T17:54:00.010 回答