解析select元素時出錯

我在網格中有一個下拉菜單。這是它的樣子。現在我是試圖獲取選擇標記的名稱。
var x = document.getElementsByTagName（'select'）; 我需要得到這個名字，並且解析它以獲得這個值。獲取這些信息的最佳途徑是什麼？解析select元素時出錯

<td class="cl"> 
    <select name="ctrlvcol%3DId%3Bctrl%3DTabListView%3Brow%3D13442111%3Btype%3Dtxt" onchange="getTypeValue(this.value,13442111)"> 
     <option value="1025">TEST-AAAA</option> 
     <option selected="" value="1026">TEST-BBBB</option> 
     <option value="1027">TEST-CCCC</option> 
    </select> 
</td>

來源

2013-08-05 Venkat

UNESCAPE（「ctrlvcol％3DId％3Bctrl％3DTabListView％3Brow％3D13442111％3Btype％3Dtxt」）分裂（「行=」）[1] .split。（「;」）[0] – dandavis

這是文檔中唯一的'select'元素嗎？如果不是，你怎麼區分它與其他人？ – Bergi

如果名稱未知，則可能需要更精確的方法來檢索元素。我建議使用id或class來標記它。 – asymptoticFault

這裏有一些代碼可以幫助你。這個小片段將工作當且僅當這是頁面上唯一的select元素。正如上面的評論所述，最好用id來標識這個元素。但是，對於您的使用情況下，下面應該工作：

// Get all select elements (in this case the one) on the page. 
var elems = document.getElementsByTagName("select"); 

// Select the first "select" element and retrieve the "name" attribute from it 
var nameAttr = decodeURIComponent(elems[0].getAttribute("name")); 

// Split the decoded name attribute on the ";" and pull the second index (3rd part) 
var nameProp = nameAttr .split(';')[2]; 

// Substr the name prop from the equal sign to the the end 
nameProp = nameProp.substr(nameProp .indexOf('=') + 1);

來源

2013-08-05 20:16:15 War10ck

非常感謝:)它工作正常。 – Venkat

這是一個js API函數嗎？ decodeURIComponent – Venkat

@Venkat如果通過API函數，你的意思是一個標準的JavaScript內置函數，那麼是的。 [這裏]（https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/decodeURIComponent）是Mozilla開發者網絡頁面... – War10ck

var selectElements = document.getElementsByTagName('select'); 
var selectElementsLen = selectElements.length; 

for (var i = 0; i < selectElementsLen; i++) { 

    // split row parts 
    var rowID = unescape(selectElements[i].name).split(';'); 
    if (rowID.length >= 3) { 

     // trim meta 
     rowID = rowID[2].replace(/^row=/, ''); 

     // validate row ID 
     if (/^[0-9]+$/.test(rowID)) { 
      console.log('Valid Row ID: ' + rowID); 
      // do whatever needs to be done 
     } 
    } 
}

http://jsfiddle.net/N4sJv/

這裏的，只有正則表達式的方法：

var selectElements = document.getElementsByTagName('select'); 
var selectElementsLen = selectElements.length; 

for (var i = 0; i < selectElementsLen; i++) { 

    // extract Row ID 
    var rowID = unescape(selectElements[i].name).match(/(?:row=)([0-9]+)/); 
    if (rowID && (rowID.length >= 2)) { 
     rowID = rowID[1]; 
     console.log('Valid Row ID: ' + rowID); 
     // do whatever needs to be done 
    } 
}

http://jsfiddle.net/N4sJv/1/

記住document.getElementsByTagName（）可能不是最好的選擇因爲它選擇了所有指定的元素e DOM樹。您可能希望使用諸如jQuery之類的框架來考慮瀏覽器的兼容性和性能。

來源

2013-08-05 20:14:59 Alex

）如果我使用JQuery有什麼優勢？ – Venkat

您可以使用它來優化選擇器document.getElementsByTagName（）將基本上遍歷DOM樹並檢查每個元素，而不管它在樹中的級別如何使用jQuery選擇器「td.cl select」會跳過不是td元素的子元素的所有元素，這可能會讓你的用例過度使用，但它可能會在更大的DOM樹上表現得更好。 – Alex

解析select元素時出錯

回答

相關問題