javascript - 如果选择了一个单选条件,则 HTML 表单然后强制输入
问题描述
我有一个带有两个输入的简单 HTML 表单。一个是无线电输入,另一个是数字输入。使用 Javascript 函数,如果单选选项选择为 Insurance - YES(1),则脚本必须强制在 Insurance Value ins_value 输入上输入数值。如果单选输入被选为否,则在文本输入中不输入任何输入。
我试图找到一个类似的示例,但只找到触发警报的简单示例。我正在学习 Javascript 并且已经通过教程 - 但也没有类似的例子。
<script>
function INSURANCE() {
var insurance = document.forms["RegForm"]["optradio"];
var ins_value = document.forms["RegForm"]["ins_value"];
if (insurance.value == 0) {
"";
return false;
} else {
if (ins_value.value == "") {
window.alert("Please insert Insurance value.");
ins_value.focus();
return false;
}
return true;
}
</script>
我希望一旦提交表单,它应该根据无线电输入选择强制输入或不输入保险值。
解决方案
var radio = document.getElementById('optradio');
var input = document.getElementById('ins_value');
radio.addEventListener("click", function(){
if(radio.value == 0){
radio.value = 1;
this.checked = true;
input.removeAttribute('disabled')
input.value = radio.value;
}
else{
radio.value = 0;
input.setAttribute('disabled','disabled');
input.value = '';
this.checked = false;
}
});
<input type="radio" name="optradio" id="optradio" value="0">
<input type="number" name="ins_value" id="ins_value" value="" disabled>
像这样向您的数字输入添加disabled
属性
html:
<input type="radio" name="optradio" id="optradio" value="0">
<input type="number" name="ins_value" id="ins_value" value="" disabled>
脚本:
<script type="text/javascript">
var radio = document.getElementById('optradio');
var input = document.getElementById('ins_value');
radio.addEventListener("click", function(){
if(radio.value == 0){
radio.value = 1;
this.checked = true;
input.removeAttribute('disabled')
input.value = radio.value;
}
else{
radio.value = 0;
input.setAttribute('disabled','disabled');
input.value = '';
this.checked = false;
}
});
</script>
在您的 html 代码下方添加脚本
推荐阅读
- reactjs - Firestore - 简单的全文搜索解决方案
- android - 使用 Class.forName("org.mysql.Driver"); 时出现 ClassNotFoundException;在安卓中
- spring - Spring Boot 是否需要 @Import 注释?
- artillery - 如何验证负载测试的每次调用在流程链的末端产生了成功的结果?
- serial-port - 在 Ubuntu for W10 (WSL) 中使用串行端口
- c# - 将 VB6 变量转换为 C#
- r - 如何在R中方程组的开头绘制轴
- java - 通过首先过滤同一对象的其他唯一值来对对象的值求和
- python - 使用 python 子进程调用时如何让 GAP 识别 Read("filename.g")
- php - 获取每月的第一天,输出错误的第一天