2012-03-20 91 views
1

这段代码有什么问题?jQuery Button没有被点击

<!DOCTYPE html> 
<html> 
<head> 
    <title>WebService Example</title>   
    <meta name="viewport" content="width=device-width, initial-scale=1">    
     <link rel="stylesheet" href="jquery.mobile-1.0.1.min.css" /> 
     <script src="jquery.js"></script> 
     <script src="jquery.mobile-1.0.1.min.js"></script>    
     <script type="text/javascript">     
      $("#Btn").click(function (event) { 
        alert("Button Clicked");        
       });               
     </script>    
</head> 
<body>   
    <div data-role="page"> 
     <div data-role="header" data-nobackbtn="false"> 
      <div><a href="index.html">Back</a></div> 
     </div>       
     <div data-role="content"> 
      This is the content 
     </div>       
     <div data-role="footer">      
      <a href="#" data-role="button" 
        data-icon="info" id="Btn">Button</a> 
     </div>    
    </div>   
</body> 

回答

5

的代码运行之前DOM已准备就绪。把它放在一个DOM ready事件处理中:

$(document).ready(function() { 
    //Code that interacts with the DOM (such as binding event listeners...) 
    $("#Btn").click(function (event) { 
     alert("Button Clicked");        
    }); 
}); 
1

把脚本体内后,这样一旦按钮被发现浏览器会附加事件。

或放在document.ready中。