首頁 > web前端 > js教程 > 主體

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

WBOY
發布: 2016-05-16 17:14:35
原創
951 人瀏覽過
複製程式碼 程式碼如下:






/**
* 向上移動選取的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);
}












相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板
關於我們 免責聲明 Sitemap
PHP中文網:公益線上PHP培訓,幫助PHP學習者快速成長!