首頁 >web前端 >js教程 >jQuery操作Select的Option上下移動及移除新增等等_jquery

jQuery操作Select的Option上下移動及移除新增等等_jquery

WBOY
WBOY原創
2016-05-16 17:14:35989瀏覽
複製程式碼 程式碼如下:






/**
* 向上移動選取的option
*/
function upSelectedOption(){
if(null == $('#where').val()){
alert('請選一項');
return false;
}
//選取的索引,從0開始
var optionIndex = $('#where').get( 0).selectedIndex;
//如果選取的不在最上面,表示可以移動
if(optionIndex > 0){
$('#where option:selected').insertBefore($('# where option:selected').prev('option'));
}
}

/**
* 向下移動選取的option
*/
function downSelectedOption(){
if( null == $('#where').val()){
alert('請選擇一項');
return false;
}
//索引的長度,從1開始
var optionLength = $('#where')[0].options.length;
//選取的索引,從0開始
var optionIndex = $('#where').get( 0).selectedIndex;
//如果選擇的不在最下面,表示可以向下
if(optionIndex $('#where option:selected').insertAfter ($('#where option:selected').next('option'));
}
}

/**
* 移除選取的option
*/
function removeSelectedOption(){{
if(null == $('#where').val()){
alert('請選一個');
return false;
}
$(' #where option:selected').remove();
}

/**
* 取得所有的option值
*/
function getSelectedOption(){
//取得Select選取的Text
var checkText = $('#where').find('option:selected').text();
//取得Select選擇的Value
var checkValue = $('#where').val ();
alert('目前被選取的text=' checkText ', value=' checkValue);
var ids = '';
var options = $('#where')[0] .options;
for(var i=0; iids = ids '`' options[i].id;
}
alert('目前被選取的編號順序為' ids);
}

/**
* 加入option
*/
function addSelectedOption(){
//新增在第一位置
$ ('#where').prepend('');
//加在最後一個位置
$('#where' ).append('');
$('#where').attr('size', 7);
}












陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn