Jade 按钮和 jQuery 点击事件答案

【问题标题】：Jade button and jQuery click eventJade 按钮和 jQuery 点击事件
【发布时间】：2012-09-30 22:23:37
【问题描述】：

我不明白为什么它不起作用...

我有这个 index.jade 文件：

!!! 5
html
  head
    link(rel='stylesheet', href='/stylesheets/style.css')
    script(src="/javascripts/jquery-1.8.2.js")
           script
       $("#rollButton").click(function() {
          alert("sas");
       });
  body
     input#rollButton(type="button", value="Roll")

它应该会弹出警报！我错过了什么？

生成的 HTML 似乎没问题：

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="/stylesheets/style.css">
<script src="/javascripts/jquery-1.8.2.js"></script>
<script src="/socket.io/socket.io.js"></script>
<script>
$("#rollButton").click(function() {
  alert("sas");
});
</script>
</head>
<body>
<input id="rollButton" type="button" value="Roll">
</body>
</html>

【问题讨论】：

只查看生成的页面源？答案应该是显而易见的
你的脚本缩进错误
顺便说一句，如果你不想发疯，我只会把 html 放在玉中，需要你的脚本并将你的 javascript 代码写在另一个文件中。

标签： jquery pug

【解决方案1】：

我还不熟悉[jade]，但是应该没有jQuery“onReady”功能，比如这个：

!!! 5
html
  head
    link(rel='stylesheet', href='/stylesheets/style.css')
    script(src="/javascripts/jquery-1.8.2.js")
    script
       $(document).ready(function(){
         $("#rollButton").click(function() {
          alert("sas");
         });
       });
  body
     input#rollButton(type="button", value="Roll")

编辑：我不确定缩进。正如我在其他 cmets 中看到的那样，它也应该被修复。

【讨论】：

上帝，不敢相信我错过了 $(document).ready 哈哈，已经挣扎了半个小时。谢谢:)

【解决方案2】：

删除这个！！！ 5

html
 head
link(rel='stylesheet', href='/stylesheets/style.css')
script(src="/javascripts/jquery-1.8.2.js")
       script
   $("#rollButton").click(function() {
      alert("sas");
   });
body
 input#rollButton(type="button", value="Roll")

【讨论】：