摘要:[jQuery]-jQuery的第一次
這次為了在 google app 上開發應用程式，第一次用 python 寫web page , 寫到表單驗證的時候,打算使用jQuery來做些效果,不料....步步坎坷,廢話不多說,直接把這兩天卡關解決方法記下來
Trouble Description :
網路上找到的文章，都很容易的只要把包有 jQuery Library 給拿回來就能用了，"拿"這部份，我沒什麼問題，不過要用的時候，寫了一些基本的jQuery語法，但就是沒反應。
Solution :
先講講怎麼"拿"
方法 a)：
在網頁的<head> </head>之間，直接加入一行
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
如果不想從網路上去載入，也可以將 jquery-latest.min.js 抓回來，放在自己的資料夾上，將路徑改過即可。
方法 b)：
從 google 提供的 jsapi 將 jQuery library 載入回來，同樣在<head> </head>之間加入一行
<script src="http://www.google.com/jsapi?key=abc" type="text/javascript"></script>
abc 這三個字是要去 google 申請的,請入內親洽
不申請也能用.... = =
再來說怎麼"用"
a).直接載入網路上的 jQuery library . js ，把你寫好要執行的function像下面寫的，包在 $(document).ready 裡面
<script type="text/javascript">
$(document).ready(function() {
$("p").click(function() {
$(this).css("background-color", "blue");
alert('hiP');
});
$("input#aa").click(function() {
$(this).css("background-color", "blue");
alert('hiB');
});
alert(' jQuery loaded !');
});
</script>
b).申請 google jsapi 的話，一樣把你寫的程式碼包在 google.setOnLoadCallback()裡面
<!--- if use google jsapi , please write functions in google.setOnLoadCallback()---->
//載入jQuery
google.load("jquery","1")
google.setOnLoadCallback(function(){
$("p").click(function() {
$(this).css("background-color", "blue");
alert('hiP');
});
$("input#aa").click(function() {
$(this).css("background-color", "blue");
alert('hiB');
});
alert('Google jsapi loaded!');
}
);
</script>
以上兩種方法，我想應該都是確保網頁在Render的時候，也許有些元件還沒被Render出來，就急著去執行，造成根本找不到元件而發生錯誤，偏偏錯誤發生之後，好像又不會繼續往下執行，所以就一直 hang 在那邊，以為根本沒載入。
另外要注意的是，上面這兩種方法，好像不能一起用，我一開始也是把 $(document).ready 跟 google.setOnLoadCallback() 兩種方法混著用，但是在Firebug會出現錯誤訊息，而且功能失效!
firefox上可以安裝一套叫 firebug 的套件，可以完整的針對 script 的部份做偵錯，還不錯用. firebug download