2014-01-26 56 views
1

我不明白为什么这个jQuery脚本不起作用;jQuery单击不工作,但jquery加载

$("#send").click(function() { 
    console.log("ee"); 
}); 

console.log("test"); 

当我加载页面,我看到'测试'在控制台,所以jQuery页面加载。但是当我点击#发现它没有工作?

<!DOCTYPE html> 
<html> 
    <head> 
     <title>Chat-o-matic</title> 
     <script src="//cdnjs.cloudflare.com/ajax/libs/socket.io/0.9.16/socket.io.min.js" type="text/javascript"></script> 
     <script src="//code.jquery.com/jquery-1.10.2.min.js" type="text/javascript"></script> 
     <script src="chat.js" type="text/javascript" type="text/javascript"></script> 
     <link href="chat.css" rel="stylesheet" type="text/css" /> 
    </head> 

    <body> 
     <div id="container"> 
      <h1>Chat-o-matic</h1> 
      <div id="round"> 
       <p>Om de chat te joinen, typ een chatnaam in</p> 
       <input type="text" id="chatname" placeholder="Typ hier je chatnaam in..."> 
       <button id="send">Join de chat</button> 
      </div> 
     </div> 
    </body> 
</html> 

那么,有人知道为什么这不起作用,以及如何解决它?

+0

您是否在[document-ready handler](http://api.jquery.com/ready/)中绑定了事件? – Satpal

+0

不,只有一个。 请参阅HTML。 – DazDylz

+0

[Simple jQuery click not working]可能的重复(http://stackoverflow.com/questions/8716655/simple-jquery-click-not-working) – undefined

回答

1

您的JavaScript的第一块应包裹在的document.ready函数后内$(document).ready(function(){........});

$(document).ready(function(){ 
    $("#send").click(function() { 
     console.log("ee"); 
    });  
}); 

代码要结合事件。

$(document).ready(function(){ 
    $("#send").click(function() { 
     console.log("ee"); 
     alert("This works!"); 
    }); 
    console.log("test"); 
}); 

希望这会有所帮助。

0

试试这个。

<!DOCTYPE html> 
<html> 
    <head> 
     <title>Chat-o-matic</title> 
     <script src="//cdnjs.cloudflare.com/ajax/libs/socket.io/0.9.16/socket.io.min.js" type="text/javascript"></script> 
     <script src="//code.jquery.com/jquery-1.10.2.min.js" type="text/javascript"></script> 
     <script src="chat.js" type="text/javascript" type="text/javascript"></script> 
     <link href="chat.css" rel="stylesheet" type="text/css" /> 
     <script type="text/javascript"> 
      $(document).ready(function(){ 
       $("#send").click(function() { 
        console.log("ee"); 
       }); 

       console.log("test"); 
      }); 
     </script> 
    </head> 

    <body> 
     <div id="container"> 
      <h1>Chat-o-matic</h1> 
      <div id="round"> 
       <p>Om de chat te joinen, typ een chatnaam in</p> 
       <input type="text" id="chatname" placeholder="Typ hier je chatnaam in..."> 
       <button id="send">Join de chat</button> 
      </div> 
     </div> 
    </body> 
</html>