玉中的点击事件答案

【问题标题】：onclick event in jade玉中的点击事件
【发布时间】：2012-07-30 11:45:33
【问题描述】：

我正在尝试在jade中做一个简单的警报事件，但它不工作，不知道是什么问题，也许你们能找到它？

代码： PS：你可以忽略socket.io代码

html
head
script(src='jquery-1.7.1.js')
  script(src='/socket.io/socket.io.js')
script
  var socket = io.connect('http://localhost:3002/add_users');
  socket.on("update", function(message) {
  console.log("update: ", message)
  });
  $(function() {
  $("button").click(function() {
    alert("hej");
  });
  });   
body
.container
.content
    header.page-header
       h1 Welcome
    .row

            form(action='/', method='post')
                fieldset
                        label(for="name") Namn
                            input(type="text", size="30", name="name", required="required")
                            button Save
            ul
                li <a href="/users">User list</a>

【问题讨论】：

你能把渲染的页面也贴出来吗？

标签： javascript jquery web click pug

【解决方案1】：

我自己对 Jade 没有太多经验，但你的script(src='/socket.io/socket.io.js') 不是缩进不正确吗？

如果是，我认为这会导致socket.io.js 无法正确加载。如果它没有正确加载，那么在绑定 jQuery DOMReady 侦听器之前，您的 javascript 执行将在 io.connect 处中断。

【讨论】：

正如我提到的，与 socket.io 代码无关，我只想要一个简单的警报消息。即使我删除了 socket.io 代码，它也没有给出一个弹出警报。
@nihulus：即使是不相关的代码也可能会破坏你的执行，但如果它有问题的话。你介意发布渲染的输出吗？
@nihulus 要扩展 David 的答案...检查生成的输出并查看您的 socket.io 脚本是否正在 <script src='jquery'></script> 标记中加载。这不应该比您的其他脚本标签缩进更多。另外，我会将 socket.io 的内容移到您的 jquery 就绪函数中或在 body 标记之后，因为这可能在脚本加载之前执行，并且 js 错误会阻止 .click 函数执行。

【解决方案2】：

我认为您的 $("button").click() 代码在 DOM 加载之前执行。你应该明确地将你的函数传递给$.ready()。

PS：我知道将函数传递给 jQuery（你所做的）应该与 $.ready() 相同，但我之前遇到过同样的问题。

【讨论】：

我认为从 jquery 1.4 开始，将函数传递给 $() 函数一直是 $.ready() 的快捷方式。