导航:首页 > 编程语言 > js更改select选项

js更改select选项

发布时间:2021-02-14 03:10:29

js如何通过select下拉列表来修改表中的数据

<body>
<select onchange="cha(this)">
<option value="">abc</option>
<option value="">efg</option>
<option value="">hij</option>
</select>
<span id="txt"></span>
</body>
<script type="text/javascript">
function cha(obj){
//获取选中的option
var index = obj.selectedIndex;
//取选中的option的文本 是取值还是取属性就随意了
var val = obj.options[index].text;
//判断val规则,可以用数组,也可以用if判断 很灵活的一个位置
/*.......根据val的值判断规则改变id为txt的值..........*/
//
var txt = document.getElementById('txt');
if(val == "efg"){
txt.innerHTML = "EFG";
}else if(val == "hij"){
txt.innerHTML = "HIJ";
}else{
txt.innerHTML = "";
}
}
</script>

Ⅱ js 怎么动态设置 option 的selected 选项

通过for循环判断每个选项,一旦满足条件则设置其selected属性为true即可,关键代码

(2)js更改select选项扩展阅读:

selected定义和用法

selected属性规定在页面加载时预先选定该选项。

被预选的选项会显示在下拉列表最前面的位置。

也可以在页面加载后通过 JavaScript 设置 selected 属性。

Ⅲ 使用javascript如何改变select控件的选中项

你好!!


可以通过设置value和selectedIndex来改变选中内项容:

varobj=document.getElementById('selTest');
obj.selectedIndex=0;//通过设置选中项索引
obj.value=0;//通过设置选中项的值

Ⅳ 怎么通过javascript设置更改对应的option选项

加入乘客类型select的id是aa,证件类型的id是bb
window.onload = function() {
var aa = document.getElementById("aa");
var bb = document.getElementById("bb");
aa.onchange = function() {
var aaValue = "";
for(var i = 0; i < aa.options.length; i++) {
if(aa.options[i].selected == true) {
aaValue = aa.options[i].innerHTML;
}
}
if(aaValue == 'baby') {
for(var i = 0; i < bb.options.length; i++) {
if(bb.options[i].innerHTML == 'other') {
bb.options[i].selected = true;
}
}
}
}
}
运行测试通过

Ⅳ javascript动态控制select option 获取value并刷新 改变selected

document.getElementByid('sel').onchange=function(){
document.getElementsByTagName('body')[0].style.fontSize=document.getElementByid('sel').value;
}
sel是select下拉列表的id,你这个option的值不对需要改下,改成存版在权的字体

Ⅵ 怎么用js动态 设置select中的某个值为选中值

用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'。

(6)js更改select选项扩展阅读

js动态设置Select中Option选中

/** *设置select选中

*@paramselectIdselect的id值

*@paramcheckValue选中option的值

*@authorlqy */

functionsetSelectChecked(selectId,checkValue){

varselect=document.getElementById(selectId);

for(vari=0;i<select.options.length;i++){

if(select.options[i].innerHTML==checkValue){

select.options[i].selected=true;

break; } } };

Ⅶ javascript动态 改变option的select属性

http://lovexuwenhao.javaeye.com/blog/422017

关于 此控件的所有操作~ 另写了一个 例子专

请采纳属 谢谢.

Ⅷ 如何通过js动态设置select中option选中

<selectname="menu"id="menu">
<optionid="1">111</option>//111是显示给用户的信息
<optionid="2">222</option>
<optionid="3">333</option>
<optionid="4">444</option>
<optionid="5">555</option>
</select>
<scripttype="text/javascript">
functiondisplay(optionID){
varall_options=document.getElementById("menu").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>

Ⅸ 怎那样用js实现点击select下拉框中的选项更改页面内容

给下拉菜单赋值的语句(有错误)
var Dept = mainPage.document.getElementsByName("Dept")[i-1];
for(var k=0;k<Dept.length;k++) {
if(Dept[k].value==trim(treatDetailRow.cells[2].innerHTML)) {
Dept[k].selected=true;
}
}
+++++++++++++++
下拉菜单
newCell=newRow.insertCell();
newCell.align="center";
newCell.className="row";
newCell.height="30px";
newCell.innerHTML=
"<select id='d' name='Dept' >"+
"<logic:present name='Dept' scope='request'>"+
"<logic:iterate id='d' name='Dept'>"+
"<option value='<bean:write name='d' property='deptCode'/>'>"+
"<bean:write name='d' property='deptName'/>"+
"</option>"+
"</logic:iterate>" +
"</logic:present>" +
"</select>"+
"<input type='hidden' name='deptName' />";var Dept = mainPage.document.getElementsByName("Dept")[i-1];
for(var k=0;k<Dept.length;k++) {
if(Dept[k].value==trim(本页面下拉菜单的值 treatDetailRow.performedBy)) {
Dept[k].selected=true;
}
}

Ⅹ 中js想动态设置select选中的值怎么弄

可以使用javascript和jQuery两种实现方式
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>

阅读全文

与js更改select选项相关的资料

热点内容
网络中常用的传输介质 浏览:518
文件如何使用 浏览:322
同步推密码找回 浏览:865
乐高怎么才能用电脑编程序 浏览:65
本机qq文件为什么找不到 浏览:264
安卓qq空间免升级 浏览:490
linux如何删除模块驱动程序 浏览:193
at89c51c程序 浏览:329
怎么创建word大纲文件 浏览:622
袅袅朗诵文件生成器 浏览:626
1054件文件是多少gb 浏览:371
高州禁养区内能养猪多少头的文件 浏览:927
win8ico文件 浏览:949
仁和数控怎么编程 浏览:381
项目文件夹图片 浏览:87
怎么在东芝电视安装app 浏览:954
plc显示数字怎么编程 浏览:439
如何辨别假网站 浏览:711
宽带用别人的账号密码 浏览:556
新app如何占有市场 浏览:42

友情链接