如何实现表单里的select值与input关联?

先在select预存几项option值分别为A、B、C、D。当我要选择A时另一input值为100.当选择B时的input值为200,C为300,D为400、且input... 先在select预存 几项option值分别为A、B、C、D。当我要选择A时另一input值为100.当选择B时的input值为200,C为300,D为400、且input值显示为只读,不可修改。 展开
 我来答
幻翼高达Zero
2019-07-15 · TA获得超过1.7万个赞
知道答主
回答量:499
采纳率:0%
帮助的人:8.2万
展开全部

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

1、首先,打开html编辑器,新建html文件,例如:index.html。

2、在index.html中的<script>标签,输入js代码:$('select').change(function () {$('input').val($('select').val());});。

3、浏览器运行index.html页面,此时select选择的选项变化时,它的值会自动关联到input输入框中。

wdjhz
2012-03-06 · TA获得超过3529个赞
知道大有可为答主
回答量:2227
采纳率:41%
帮助的人:686万
展开全部
假设input的id是inp
定义如下方法:
function changeInpue(select){
var valSelect = select.value;
if("A"==valSelect){
document.getElementById("inp").value=100;
}else if("B"==valSelect){
document.getElementById("inp").value=200;
}else if("C"==valSelect){
document.getElementById("inp").value=300;
}else if("D"==valSelect){
document.getElementById("inp").value=400;
}
}

然后在select上定义onchange="changeInput(this)",在input上定义readonly="readonly"或readonly="true"
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
愿过流声
推荐于2018-03-05 · TA获得超过120个赞
知道小有建树答主
回答量:200
采纳率:0%
帮助的人:127万
展开全部
直接上代码(另存为html就可以看到了):
<html>
<head>
</head>
<body>
<select id="slList" onchange="selectShow()">
<option value="100">A</option>
<option value="200">B</option>
<option value="300">C</option>
<option value="400">D</option>
</select>
<input type="text" id="txtShow" readonly="true" />
<script>
window.onload=selectShow;
function selectShow(){
document.getElementById("txtShow").value=document.getElementById("slList").value;
}
</script>
</body>
</html>
本回答被提问者和网友采纳
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
卢石罗
2012-03-06
知道答主
回答量:47
采纳率:0%
帮助的人:21.9万
展开全部
//A为select 控件ID B为input控件ID
var value= $('#A').val();
$('#B').val(value);
两句代码!
写个select 单击事件!
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
花开左岸123
2012-03-06
知道答主
回答量:38
采纳率:0%
帮助的人:20.8万
展开全部
网上随便找个二级联动的demo看一下就明白了.
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
收起 1条折叠回答
收起 更多回答(3)
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式