您的位置:首页 > Web前端 > JQuery

select获取和赋值

2017-01-05 20:36 281 查看

select获取和赋值

<!DOCTYPE HTML>
<html>
<head>
<title>select获取和赋值</title>
<meta charset="utf-8" />
<script type="text/javascript" src="C:\Users\Administrator.ROOEHB06BX1AQB1\Desktop\jquery.min.js"></script>
<script>
$(function(){
$('#select1').change(function(){
//获得select1中的text值
var $seltxt=$('#select1').find("option:selected").text();
console.info($seltxt);

//获取select选中的 value:
var $selval=$("#select1").val();
console.info($selval);

//获取select选中的索引:
var $selind=$("#select1").get(0).selectedIndex;
console.info($selind);
});
})

$(function(){
var $myobj=$('#mysel');
var $myobj2=$('#mysel2');
/*设置select 选中的text:方法1*/
$myobj.change(function(){
var $myval=$myobj.val();
var count=$("#select1 option").length;
for(var i=0;i<count;i++){
if($("#select1").get(0).options[i].text == $myval){
$("#select1").get(0).options[i].selected = true;
break;
}
}
});

/*设置select 选中的value*/
$myobj2.change(function(){
var $myval2=$myobj2.val();
$("#select1").val($myval2);
//$("#select1").get(0).value = $myval2;
//$("#select1").attr("value", $myval2);
});

})
</script>
</head>

<body>
<div class="centent">
<select id="select1" name="dd" style="width:100px;height:30px;">
<option value="0">选项1</option>
<option value="1">选项2</option>
<option value="2">选项3</option>
<option value="3">选项4</option>
<option value="4">选项5</option>
<option value="5">选项6</option>
<option value="6">选项7</option>
</select><br/>
text:<input type="text" id="mysel"/><br/>
value:<input type="text" id="mysel2"/><br/>
</div>
</body>
</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  js-jquery select