在Jade中包含用于按钮点击的Javascript

时间:2015-06-18 09:57:32

标签: javascript node.js twitter-bootstrap pug

我无法使用Node.js,Bootstrap和Jade检测按钮点击。

我有以下Jade代码,但我没有看到onclick方法的日志,并且没有更改按钮。所以这个方法永远不会被调用。

extends layout


block content
    .jumbotron
        .container
            h1= title
            p Enter the url of the file to be sent
            form#formInputURL(name="chooser",method="post",action="/chooser",)
                input#inputURL(type="text", placeholder="insert url", name="chooseurl")
                button#btnSubmit(type="submit") submit
                p
                .btn-group(data-toggle='buttons')
                    label.btn.btn-primary.active
                        input#option1(type='checkbox', autocomplete='off', checked='')
                        |  Radio 1 (preselected)
                    |   
                    label.btn.btn-primary
                        input#option2(type='checkbox', autocomplete='off')
                        |  Radio 2
                    |   
                    label.btn.btn-primary
                        input#option3(type='checkbox', autocomplete='off')
                        |  Radio 3
script.
    $('#option2').on('click', function () {
        console.log("clicked")
        $(this).button('toggle')
    })

1 个答案:

答案 0 :(得分:0)

你的代码工作正常,

确保您点击右侧元素(复选框)。

看一下这个例子:



<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

  <div class="jumbotron">
    <div class="container">
      <h1></h1>
      <p>Enter the url of the file to be sent</p>
      <form id="formInputURL" name="chooser" method="post" action="/chooser">
        <input id="inputURL" type="text" placeholder="insert url" name="chooseurl" />
        <button id="btnSubmit" type="submit">submit</button>
        <p></p>
        <div data-toggle="buttons" class="btn-group">
          <label class="btn btn-primary active">
            <input id="option1" type="checkbox" autocomplete="off" checked="" /> Radio 1 (preselected)
          </label>
          <label class="btn btn-primary">
            <input id="option2" type="checkbox" autocomplete="off" /> Radio 2
          </label>
          <label class="btn btn-primary">
            <input id="option3" type="checkbox" autocomplete="off" /> Radio 3
          </label>
        </div>
      </form>
    </div>
  </div>
  <script>
    $('#option2').on('click', function() {
      alert("clicked")
    })
  </script>
&#13;
&#13;
&#13;