Re: [問題] 新手繞不出來的Javascript 問題

看板Ajax作者B9 (葉酸酸)時間14年前 (2011/07/30 13:30)推噓1(1推 0噓 0→)

留言1則, 1人參與討論串2/3 (看更多)

※ 引述《phreat (雷)》之銘言： : 這是程式,主要目的是希望能抓取值 : 嘗試過將k改成數字是可行的但因為會跑回圈所以放在裡面 : 怎麼試都不行希望有大大指點迷津一下 : <SELECT id="test1" onchange="test('test1')"> : <option value="100">Ａ</option> : <option value="200">Ｂ</option> : <option value="300">Ｃ</option> : </SELECT> : <SELECT id="test2" onchange="test('test2')"> : <option value="100">Ａ</option> : <option value="200">Ｂ</option> : <option value="300">Ｃ</option> : </SELECT> : for (i=1; i<=2; i=i+1) : { : k=String(i); : alert(k); : cc=Number(document.getElementById("test"+k)[document.getElementById("test"+k).selectedIndex].value); : } http://jsbin.com/osatuf 請問這是你要的結果嗎？觸發 select element 的 change 時間可以看到抓到的數值。我改的地方只有：多了 test function，這是你在 select.onchange 裡面會 call 的 function。我有幾個小建議： - namespace 的建議: 你這段程式碼會在 global namespace 留下幾個變數 i, k, cc, test，在 global namespace 裡面留下的足跡越少越好。方法就是用 var 宣告這些變數。例如： function test() { var i, k, cc; }，這樣就只會有一個 test。甚至更好的方法是 (function() { 用 getElementById 抓 html element；抓到的element.onchange = function(){ 做點事情 }; })() 這樣的寫法一點也不會污染 global namespace。 - styling 的建議: cc=Number(document.getElementById("test"+k)[document.getElementById("test"+k).selectedIndex].value); 拆開比較好，我會這樣寫： element = document.getElementById("test"+k); selected = element.selectedIndex; value = element[selected].value; cc = value; 可讀性好很多，或者我自以為好很多：P - loose coupling 的建議：你的 html 跟 js 太親密了。我指把 js 放到 html 的 attribute 裡面這件事情。例如： onchange="whatever()" 假設將來這份 js 要給其他 html 檔案用，那你現在就有兩個 html，那你做好 html 檔案之後，還要一個一個 element 去加入 onchange="whatever()" 過了一段時間你不想要這個功能了，你把 js 丟掉，然後就要打開這兩個 html 檔案，一個一個把 onchange attribute 拿掉。 - type conversion 的建議： k=String(i); 是不必要的，因為之後的 "test"+k 會自動把 k 轉成 string，然後跟 "test" 結合。 cc=Number( value ) 這我沒有意見，不過有個小秘訣： cc = value - 0 或 cc = +value 都可以做 type conversion，可以少打幾個字不知道有沒有吸引力。XD - performance 的建議： document.getElementById("test"+k)[document.getElementById("test"+k).selectedIndex].value document.getElementById("test"+k) 被執行兩次，其實只要執行一次就可以了。如果其實你有注意到這裡的效能可以改善，那你應該留個 comment 例如： /* 這裡效能可以更好。 */ -- Oni devas ami animalojn. Ili estas tiel bongustaj. One should love animals. They are so tasty. 每個人都應該愛動物，他們是如此美味。 -- ※ 發信站: 批踢踢實業坊(ptt.cc) ◆ From: 175.180.52.143 ※ 編輯: B9 來自: 175.180.52.143 (07/30 13:30)