怎么用js动态 设置select中的某个值为选中值
我们使用javascript实现js动态设置select中的某个值为选中值，操作如下：
使用javascript实现：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<body>
<select name="jumpMenu" id="jumpMenu" onChange="jumpMenu('parent',this,0)">
<option id="1" value="跳转URL">111</option> // 111 是显示给用户的信息
<option id="2" value="跳转URL">222</option>
<option id="3" value="跳转URL">333</option>
<option id="4" value="跳转URL">444</option>
<option id="5" value="跳转URL">555</option>
</select>
<script type="text/javascript">
function display(optionID){
var all_options = document.getElementById("jumpMenu").options;
for (i=0; i<all_options.length; i++){
if (all_options[i].id == optionID) // 根据option标签的ID来进行判断 测试的代码这里是两个等号
{
all_options[i].selected = true;
}
}
};
display("4");
</script>
</body>
</html>
扩展资料：
Js获得元素标签名称的方法：
1、$( this ).get(0).tagName
2、$( this )[0].tagName
3、$( this ).prop("tagName")
4、$( this ).prop("nodeName")
用JS动态设置select的方法如下：
手动通过原生JS来实现：
/**
* 设置select控件选中
* @param selectId select的id值
* @param checkValue 选中option的值
*/
function set_select_checked(selectId, checkValue){
var select = document.getElementById(selectId);
for (var i = 0; i < select.options.length; i++){
if (select.options[i].value == checkValue){
select.options[i].selected = true;
break; } } }
然后通过这样来调用：
// 设置select选中该班组
set_select_checked('edit-group', group_id);
注意：不要传'#edit-group'。
扩展资料
js动态设置Select中Option选中
/** * 设置select选中
* @param selectId select的id值
* @param checkValue 选中option的值
* @author lqy */
function setSelectChecked(selectId, checkValue){
var select = document.getElementById(selectId);
for(var i=0; i<select.options.length; i++){
if(select.options[i].innerHTML == checkValue){
select.options[i].selected = true;
break; } } };
1：使用javascript实现
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<body>
<select name="jumpMenu" id="jumpMenu" onChange="jumpMenu('parent',this,0)">
<option id="1" value="跳转URL">111</option> // 111 是显示给用户的信息
<option id="2" value="跳转URL">222</option>
<option id="3" value="跳转URL">333</option>
<option id="4" value="跳转URL">444</option>
<option id="5" value="跳转URL">555</option>
</select>
<script type="text/javascript">
function display(optionID){
var all_options = document.getElementById("jumpMenu").options;
for (i=0; i<all_options.length; i++){
if (all_options[i].id == optionID) // 根据option标签的ID来进行判断 测试的代码这里是两个等号
{
all_options[i].selected = true;
}
}
};
display("4");
</script>
</body>
</html>
2：使用jQuery实现
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<body>
<select name="jumpMenu" id="jumpMenu" >
<option value="1">111</option> // 111 是显示给用户的信息
<option value="2">222</option>
<option value="3">333</option>
<option value="4">444</option>
<option value="5">555</option>
</select>
<script type="text/javascript" src="js/jquery1.8.3.min.js"></script>
<script type="text/javascript">
$(function(){
// $("#jumpMenu").val(要选中的option的value值即可);
$("#jumpMenu").val(4);
});
</script>
</body>
</html>
就可以了，这里form1是form标签的name属性值。
等好右边的东东可以是字符串变量，因此具体加多少个，怎么加，呵呵，楼主应该知道了吧？
IE下面可以。其他浏览器从没试过。
<form name='fm1'>
<select name='aa'><option>1</option></select>
</form>
<input type='button' value='ADD' onclick='javascript:Add()'>
<script language='javascript'>
i = 1;
function Add()
{
i++;
fm1.aa.length = i;
fm1.aa.options[i - 1].text = i;
}
</script>
函数定义：function SelectElement(id, valueToSelect){
var element = document.getElementById(id);
element.value = valueToSelect;
}
|
广告 您可能关注的内容 |
