怎么在javascript中实现 下拉列表中嵌套文本框

怎么在javascript中实现 下拉列表中嵌套文本框,第1张

早前写的一个,功能差不多,代码格式自己改改。
<script language="JavaScript">
var
sel = "sel",
custom = "custom",
sDefault = "自定义";
var $ = {

// 显示自定义input
forInput : function() {
var oSel = documentgetElementById(sel);
var oCus = documentgetElementById(custom);

var iSel = oSeloptionsselectedIndex;
var vSel = oSel[iSel]value;

if (vSel == sDefault) {
oSelstyledisplay = "none";
oCusstyledisplay = "";
oCusfocus();
}
},

// 显示带有自定义文本选项的select
forSel : function() {
var oSel = documentgetElementById(sel);
var oCus = documentgetElementById(custom);

oSelstyledisplay = "";
oCusstyledisplay = "none";

if (oCusvaluelength == 0) {
return false;
}

for (var i = 0; i < oSellength; i++) {
if (oSel[i]value == oCusvalue) {
oSel[i]selected = true;
return false;
}
}

oSelremoveChild(oSellastChild); // 清除自定义选项

// 添加input的选项
var cSel = documentcreateElement("option");
cSelvalue = oCusvalue;
cSelinnerHTML = oCusvalue;
cSelselected = true;
oSelappendChild(cSel);

// 补上自定义选项,确保该选项在末尾
cSel = documentcreateElement("option");
cSelvalue = sDefault;
cSelinnerHTML = sDefault;
oSelappendChild(cSel);
}

};
</script>
<select name="sel" style="width:160px;" onchange="$forInput()">
<option value="选项一">选项一</option>
<option value="选项二">选项二</option>
<option value="自定义">自定义</option>
</select>
<input type="text" name="custom" size="10" maxlength="10" style="display:none;width:160px;" onblur="$forSel()"/>

<script language='javascript'>
function check(){
var range=documentgetElementById('range')value;
var input=documentgetElementById('input-data')value;
var real= parseInt(Mathrandom()range)+1;
alert('你输入的是:'+input+' 实际值是'+real);
}
</script>
<select id='range'>
<option value='100'>1-100</option>
<option value='10'>1-10</option>
</select>
请输入:<input id='input-data' type='text' />
<input id='finish' type='button' value='finish' onclick='check()'/>

getElementById("ula")styledisplay="none";
getElementById("ula")styledisplay="block";就行

用JS判断下拉框是否选中,下面例子中,如果下拉框的值是空的,那么会d出一个提示框,如果选中了值,那么就执行代码了,参考如下:
<title>Js判断下拉框</title>
<script>
function ss(){
var slt=documentgetElementById("aa");
if(sltvalue==""){
alert("请选择一个项目");
return false;
}
return true;
}
</script>
<form method=post onsubmit=" return ss()">
<select id="aa">
<option value="">请选择</option>
<option value="1s">一</option>
<option value="2u">二</option>
</select>
<input type=submit value="提交">
</form>

需要准备的材料分别有:电脑、html编辑器、浏览器。

1、首先,打开html编辑器,新建html文件,例如:indexhtml,编写问题基础代码。

2、在indexhtml中的<script>标签,输入js代码:$('#myselect')change(function () {$('#total')val($('#myselect')val());});。

3、浏览器运行indexhtml页面,此时将下拉菜单调整为“紧急”后,文本框自动输入了5。


欢迎分享,转载请注明来源:内存溢出

原文地址: https://outofmemory.cn/yw/13357344.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-07-21
下一篇 2023-07-21

发表评论

登录后才能评论

评论列表(0条)

保存