2011-03-05 57 views
0

我對JS有點困難。Javascript + Prototype:我可以檢索使用onChange事件點擊的列表選項嗎?

我有一個列表,我只希望最多選擇10個項目。我遇到的困難是,如果使用鼠標拖動進行多重選擇,onClick事件不會觸發 - 所以我不得不使用onChange。

但是,onChange - 我無法獲得最後一個選項,因爲我認爲DOM在事件中不支持它。這裏有一個例子:

HTML:

<select id="mylist"><option>Test</option> 
<option>Test</option> 
<option>Test</option> 
<option>Test</option> 
</select> 

JS:

Event.observe('mylist', 'change', checkList); 

function checkList(e) 
{ 
    var count = 0; 
    var listObj = this; 
    // Count selected items 
    for (i=0; i < listObj.options.length; i++) { 
     if (listObj.options[i].selected) { 
      count++; 
     } 
    } 

    // If the count is over, tell me the last selected item 
    if (count > 10) { 
     var e = e || window.event; 
     var tgt = e.target || e.srcElement; 
     alert(tgt.nodeName + ' Index:' + tgt.index); 
    } 
} 

如果我我們一個onClick事件然後我得到 '選項 - 索引1' 的實例。但是使用onChange我得到了SELECT節點。

有沒有一種方法可以可靠地獲得點擊選項?

回答

0

如果你只是把邏輯放在for循環裏面怎麼辦?

function checkList(e) 
{ 
    var count = 0; 
    var listObj = this; 
    // Count selected items 
    for (i=0; i < listObj.options.length; i++) { 
     if (listObj.options[i].selected) { 
      // If the count is over, tell me the last selected item 
      if (++count > 10) { 
       alert('Index:' + i); 
       return; 
      } 
     } 
    } 

} 

甚至更​​好:

保持你的邏輯和使用選擇來獲得最後選定的選項:

$$('select#mylist option[selected]:last') 
相關問題