|
7. 在錨點(diǎn)中使用 “onclick” 替代 “javascript: Pseudo-Protocol”
如果你想在 <a> 標(biāo)簽中觸發(fā)Javascript 代碼，選擇 onclick 而非 JavaScript: pseudo-protocol；使用 onclick 來(lái)運(yùn)行的 Javascript 代碼必須返回 ture 或者false（or an expression than evalues to true or false [這句要怎么翻譯呢? 我是這樣理解的：一個(gè)優(yōu)先性高于true 或 false 的表達(dá)式]）來(lái)返回標(biāo)簽本身：如果返回 true，則錨點(diǎn)的 href 將被當(dāng)作一個(gè)一般的鏈接；如果返回 false，則 href 會(huì)被忽略。這就是為什么”return false;” 經(jīng)常被包含在 onclick 所處理代碼的尾部。
正確句法：
<a href="javascript_required.html" onclick="doSomething(); return false;">go</a>
在這個(gè)實(shí)例中，”doSomething()” 函數(shù)(定義于頁(yè)面的某個(gè)角落)將在被點(diǎn)擊時(shí)調(diào)用。href 將永遠(yuǎn)不會(huì)被啟用了Javascript 的瀏覽器訪問(wèn)。在你可以提醒Javascript 是必須的、而用戶未啟用之的瀏覽器中，文檔 javascript_required.html 才會(huì)被加載。通常，當(dāng)你確保用戶將會(huì)開(kāi)啟 Javascript 支持，為盡量簡(jiǎn)化，鏈接將只包含 href=”#”。 而這個(gè)做法是不被鼓勵(lì)的。通常有一個(gè)不錯(cuò)的做法是：可以提供沒(méi)用啟用 javascript 一個(gè)返回本地的頁(yè)面。
有時(shí)，眾多想要分情況來(lái)訪問(wèn)一個(gè)鏈接。例如，當(dāng)一個(gè)用戶要離開(kāi)你的一個(gè)表單頁(yè)面，而想先驗(yàn)證來(lái)確保沒(méi)有東西被改變。在這個(gè)情況下，你的 onclick 將會(huì)訪問(wèn)一個(gè)返回詢問(wèn)鏈接是否應(yīng)該被遵循的函數(shù)：
有條件的鏈接訪問(wèn):
<a href="/" onClick="return validate();">Home</a>
function validate() {
return prompt("Are you sure you want to exit this page?");
}
在這個(gè)實(shí)例中，validate() 函數(shù)必須只返回 ture 或 false。ture 的時(shí)候用戶將被允許問(wèn)題 home 頁(yè)面，或 false 的時(shí)候鏈接不被訪問(wèn)。這個(gè)例子提示確認(rèn)（其行為），以訪問(wèn) ture 或 false，這完全由用戶點(diǎn)擊”確實(shí)”或者”取消”決定。
下面是一些”不應(yīng)該”的例子。如果你在自己的頁(yè)面中看到下面這樣的代碼，這是不正確的，需要被修改：
什么是不應(yīng)該做的：
<a href="javascript:doSomething()">link</a>
<a href="#" onClick="doSomething()">link</a>
<a href="#" onClick="javascript:doSomething();">link</a>
<a href="#" onClick="javascript:doSomething(); return false;">link</a>
8. 使用一元 ‘+’ 號(hào)運(yùn)算符使類型轉(zhuǎn)向Number
在Javascript中，”+”號(hào)運(yùn)算符同時(shí)充當(dāng)數(shù)學(xué)加號(hào)和連接符。這會(huì)在form表單的域值相加時(shí)出現(xiàn)問(wèn)題，例如，因?yàn)镴avascript是 一個(gè)弱類型語(yǔ)言，form 域的值將會(huì)被當(dāng)作數(shù)組來(lái)處理，而你把它們”+”一起的時(shí)候，”+”將被當(dāng)成連接符，而非數(shù)學(xué)加號(hào)。
有問(wèn)題的例子:
<form name="myform" action="[url]">
<input type="text" name="val1" value="1">
<input type="text" name="val2" value="2">
</form>
function total() {
var theform = document.forms["myform"];
var total = theform.elements["val1"].value + theform.elements["val2"].value;
alert(total); // 這個(gè)將會(huì)彈出 "12", 但你想要的是 3!
}
解決這個(gè)問(wèn)題，Javascript 需要一個(gè)提示來(lái)讓它把這些值當(dāng)做數(shù)字來(lái)處理。你可以使用”+”號(hào)來(lái)把數(shù)組轉(zhuǎn)換成數(shù)字。給變量或者表達(dá)式前置一個(gè)”+”號(hào)將會(huì)強(qiáng)制其當(dāng)作一個(gè)數(shù)字來(lái)處理，而這也將使得數(shù)學(xué)”+”得以成功應(yīng)用。
修改好的代碼：
function total() {
var theform = document.forms["myform"];
var total = (+theform.elements["val1"].value) + (+theform.elements["val2"].value);
alert(total); // This will alert 3
}
出處：幸福收藏夾
責(zé)任編輯：bluehearts
上一頁(yè) 14條最佳JS代碼編寫(xiě)技巧 [3] 下一頁(yè) 14條最佳JS代碼編寫(xiě)技巧 [5]
◎進(jìn)入論壇網(wǎng)頁(yè)制作、WEB標(biāo)準(zhǔn)化版塊參加討論，我還想發(fā)表評(píng)論。
|
第 1 頁(yè) 
第 4 頁(yè) 14條最佳JS代碼編寫(xiě)技巧 [4]
