我不能用「jsbin」代碼localy，這一切的JQuery

-2

首先是該代碼是用來顯示和使用一個按鈕，當我本地運行它不起作用隱藏DIV代碼JS BIN 我不能用「jsbin」代碼localy，這一切的JQuery

！！，這是我的html代碼

<!DOCTYPE html> 
<html> 
<head> 
<script src="//fb.me/react-with-addons-0.9.0.js"></script> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> 
    <meta charset=utf-8 /> 
<title>JS Bin</title> 
<style> 
#login_Box_Div{ 
    background:#999; 
    display:none; 
} 
</style> 
<script> 
$('#buttonLogin').click(function(){ 
    $('#login_Box_Div').toggle(); 
}); 
</script> 
</head> 
<body> 


<h3> <a href= "#">Pictio </a> <button id="buttonLogin">LogIn</button></h3> 

    <div id = "login_Box_Div"> 
     <form name = "myform" > 
      <input type = "text" name = "username" placeholder = "Username" /> 
      <input type = "password" name = "password" placeholder= "Password" /> 
      <input type = "submit" id = "submitLogin" /> 
     </form> 

</div> 






    </body> 
</html>

來源

2014-04-15 user3348284

您忘記了document.ready – adeneo

瀏覽器從上到下閱讀。當您的jQuery執行時，瀏覽器尚未找到該元素，因此沒有任何反應。將<script>標籤移動到頁面的底部（位於正文結束標籤之前）。或者，你可以將你的jQuery代碼包裝在$(document).ready(中，這會延遲執行直到整個頁面被讀取。

來源

2014-04-15 18:19:56 SomeKittens

對不起，我不是JQuery開發人員-_- – user3348284

@ user3348284謝謝您的接受。 – SomeKittens

替換此 -

<script> 
$('#buttonLogin').click(function(){ 
    $('#login_Box_Div').toggle(); 
}); 
</script>

本 -

<script> 
$(document).ready(function() { // tells jquery that the document is ready to whirl 
    $('#buttonLogin').click(function(){ 
     $('#login_Box_Div').toggle(); 
    }); 
}); 
</script>

的代碼放入文件準備處理基本上可以讓jQuery的知道，所有的元素都在文檔中。一旦他們在文檔中，他們就可以按照您編寫的代碼行事。如果沒有這個處理程序，代碼就會運行，而不考慮元素是否存在，這可能會導致一些問題，正如您所見。

來源

2014-04-15 18:26:03

這工作完美..謝謝你的幫助 – user3348284

對不起，但你能解釋有什麼區別？ – user3348284

爲了清晰我編輯了帖子。 –

我不能用「jsbin」代碼localy，這一切的JQuery

回答

相關問題