如何使用javascript函數通過ID對選擇元素進行排序？

我有這個下拉列表屬性name和id定義，我也調用一個函數。如何使用javascript函數通過ID對選擇元素進行排序？

<select id="myid" name="myid" onClick="sortlist(this.id)"> 
    <option value="volvo">b</option> 
    <option value="saab">c</option> 
    <option value="mercedes">a</option> 
    <option value="audi">d</option> 
    <option value="audi">s</option> 
    <option value="audi">f</option> 
</select>

我想按字母順序排序它，當用戶點擊（或沒有）和我發現這個算法

function sortlist(selElem) { 
    var tmpAry = new Array(); 
    for (var i=0;i<selElem.options.length;i++) { 
    tmpAry[i] = new Array(); 
    tmpAry[i][0] = selElem.options[i].text; 
    tmpAry[i][1] = selElem.options[i].value; 
    } 
    tmpAry.sort(); 
    while (selElem.options.length > 0) { 
    selElem.options[0] = null; 
    } 
    for (var i=0;i<tmpAry.length;i++) { 
    var op = new Option(tmpAry[i][0], tmpAry[i][1]); 
    selElem.options[i] = op; 
    } 
    return; 
}

我通過元素id運行，因爲我想用同樣的功能其他下拉列表，但這是行不通的。

你可以請我睜開眼睛，我做錯了什麼？

檢查的jsfiddle這裏：http://jsfiddle.net/u5YZp/

來源

2013-12-23 M. Coutinho

這就是你必須這樣做的。 JSFiddle。

你需要傳遞ELEM，沒有ID，你的功能應該是全球

<select id="myid" name="myid" onClick="sortlist(this)">

來源

2013-12-23 06:35:49

謝謝！這解決了問題。我雖然是「this.id」。我會接受這個，因爲我可以保留我的功能。 –

嗨，我的列表已排序，但它總是選擇它的第一個元素，即使我選擇其他！：爲什麼？ –

我想每次當你改變時，它再次排序，看看這個jsfiddle。 http://jsfiddle.net/u5YZp/6/ –

試試這個

HTML

<select id="myid" name="myid" > 
    <option value="volvo">Volvo</option> 
    <option value="saab">Saab</option> 
    <option value="mercedes">Mercedes</option> 
    <option value="audi">Audi</option> 
</select>

腳本

var mylist = $('#myid'); 
var listitems = mylist.children('option').get(); 
listitems.sort(function(a, b) { 
    var compA = $(a).text().toUpperCase(); 
    var compB = $(b).text().toUpperCase(); 
    return (compA < compB) ? -1 : (compA > compB) ? 1 : 0; 
}) 
$.each(listitems, function(idx, itm) { mylist.append(itm); });

DEMO

來源

2013-12-23 06:34:15

我想在運行你的代碼的每個選擇上調用一個函數。我可以有一個函數內的jQuery？ –

@ M.Coutinho是的，你應該在你的文件中有Jquery lib –

謝謝你的關注，我接受@Mujtaba Haider解決方案，因爲我可以保留我的功能，只需編輯一個小東西，但是你的解決方案也很好。謝謝你，先生。 –

這裏有一個辦法做到這一點在普通的JavaScript：

演示：http://jsfiddle.net/u5YZp/4/

var select = document.getElementById('myid'); 

var sortSelect = function(select) { 

    var toArray = function(x) { 
    return [].slice.call(x); 
    }; 

    var options = toArray(select.children); 

    var sorted = options.sort(function(a, b) { 
    return a.value > b.value; 
    }); 

    sorted.forEach(function(op) { 
    select.appendChild(op); 
    }); 

    sorted[0].selected = true; 
}; 

sortSelect(select);

來源

2013-12-23 06:38:03 elclanrs

如何使用javascript函數通過ID對選擇元素進行排序？

回答

相關問題