在html页面中加一个select控件,option value为1,2,3,4;当选择为1时,值为01,绑定到新的input 控件e上
时间: 2024-11-13 14:39:28 浏览: 11
在HTML页面中添加一个`<select>`控件,你可以这样做:
```html
<select id="mySelect" onchange="updateValue()">
<option value="1">01</option>
<option value="2">...</option>
<option value="3">...</option>
<option value="4">...</option>
</select>
<input type="text" id="inputValue" readonly placeholder="Value will be displayed here">
```
在这个例子中,`<select>`元素的id设为`mySelect`,并绑定了`onchange`事件,当用户更改选项时会触发`updateValue()`函数。
接下来,你需要编写JavaScript代码来处理这个事件:
```javascript
function updateValue() {
var select = document.getElementById("mySelect");
var inputValue = document.getElementById("inputValue");
if (select.value === '1') {
inputValue.value = '01';
} else {
inputValue.value = select.value; // 如果不是1,显示原始的value
}
}
```
这里,当你选择`option`值为1时,`inputValue`的值会被设置为`01`。如果选择其他值,则直接显示对应的值。请注意,`inputValue`设置为`readonly`属性,使其仅读取而无法编辑。
阅读全文