Question

我对JQuery Mobile中的按钮有一点问题。

这是我定义按钮的方式：

<div data-role="page">
      <div data-role="header">
                <h1>Sample</h1>
      </div>
      <div data-role="content">
          <a id='btn' href='#' data-role='button' 
           data-icon='check' data-iconpos='right'>Click the button</a>
      </div>
</div>

然后我有一个用于事件处理的小脚本（在index.html内）：

        <script>                
            $("#btn").bind("click", function(event) {
                alert("click");
            });
        </script>

但不幸的是，这不起作用。 :(

有人能帮助我吗？我是JavaScript新手。

Answer 1

尝试.on()功能：

    <script>  
      $(function(){            
        $("#btn").on("click", function(event) {
            alert("click");
        });
      });  
    </script>

如果您需要将每次$("#btn")元素添加到事件处理程序，则可以使用：

$(document).on('click', "#btn",function(event) {...

使用@Terry建议编辑：

在绑定事件之前，您还应该使用$(function(){ ...来确保DOM已准备就绪。

Answer 2

首先，您应该说明一个脚本type，如下所示：

<script type="text/javascript"> [code here] </script>

然后在脚本标记内部，您应该在页面加载后包装您想要执行的任何代码：

    <script type="text/javascript">  
        $(function(){
             $("#btn").bind("click", function(event) {
                  alert("click");
             });
        });
    </script>

处理按钮单击

2 个答案: