Javascript 如果第二个输入字段已填充，则禁用输入字段
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/6771281/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Disable an input field if second input field is filled
提问by debrajsy
totally a newbie... I just want to know how to dynamically disable an input field when the second input field is filled
完全是一个新手......我只想知道如何在填充第二个输入字段时动态禁用输入字段
eg:
例如：
<td><input type="text" name="num-input1" id="dis_rm" value=""></input></td>
<td><input type="text" name="num-input2" id="dis_per" value="" ></input></td>
pls... any links and hints will do...
请...任何链接和提示都可以...
回答by Ibu
You simply need to give it a disabled property:
你只需要给它一个禁用的属性：
document.getElementById("dis_rm").disabled = true;
document.getElementById("dis_per").disabled = true;
you can use the on change event to see if one of them is filled:
您可以使用 on change 事件查看其中一个是否已填充：
var dis1 = document.getElementById("dis_rm");
dis1.onchange = function () {
if (this.value != "" || this.value.length > 0) {
document.getElementById("dis_per").disabled = true;
}
}
so if the first one is filled, the second one will be disabled
所以如果第一个被填满，第二个将被禁用
回答by Jason Gennaro
$('#dis_per').blur(function(){
if($(this).val().length != 0){
$('#dis_rm').attr('disabled', 'disabled');
}
});
http://jsfiddle.net/jasongennaro/D7p6U/
http://jsfiddle.net/jasonennaro/D7p6U/
Explanation:
解释：
when the second input loses focus...
.blur()check to see if it has something inside it. Do this by making sure its length is not zero
!=0if it has something in it, add the
attributedisabledand set it todisabled
当第二个输入失去焦点时......
.blur()检查它里面是否有东西。通过确保其长度不为零来做到这一点
!=0如果里面有东西，添加并将其
attributedisabled设置为disabled
回答by rkw
Just ad this to your 2nd text box:
只需将此广告添加到您的第二个文本框：
onblur="document.getElementById('dis_rm').disabled = (''!=this.value);"
回答by Kanishka Panamaldeniya
$('#secondinput').live('blur',function(){
$('#firstinput').attr('disabled', true);
});
tihs works when you filled the second input field and click else where ..........
当您填写第二个输入字段并单击其他位置时，tihs 起作用.........
回答by Paul Sonier
Set the disabledflag on the field you want to disable when the OnBlurevent fires (for exiting the field) or when the OnChangedevent fires (with, of course, validation on the change).
disabled在OnBlur事件触发时（用于退出字段）或OnChanged事件触发时（当然，对更改进行验证）在要禁用的字段上设置标志。
回答by Bakudan
We can ommit some steps, refering to the form as object.
我们可以省略一些步骤，将表单称为对象。
document.form1.num-input2.onchange = function() {
if ( this.value != "" || this.value.length > 0 ) {
document.form1.num-input1.disabled = true;
}
}
回答by John
I like this answer, using Jquery:
我喜欢这个答案，使用 Jquery：
$('#seconddiv').live('focus',function(){
$('#firstdiv').attr('disabled', true);
});
I have a search bar that gives search results with every key press, if it returns no results then the user is presented with a form to ask for help. But if they fill out the "ask form" then type in the search bar again it will erase everything they entered in the ask form. So to solve this, I gave all the inputs in the ask form an id of "second div" and the search field id="firstdiv". Now, if they click or tab to one of the input fields of the ask form it will disable to search bar so their data will never be over written.
我有一个搜索栏，每次按键都会提供搜索结果，如果它没有返回结果，那么用户会看到一个表单来寻求帮助。但是，如果他们填写了“询问表”，然后再次在搜索栏中输入，则会删除他们在询问表中输入的所有内容。所以为了解决这个问题，我给了 ask 表单中的所有输入一个“second div”的 id 和搜索字段 id="firstdiv"。现在，如果他们单击或选择询问表单的输入字段之一，它将禁用搜索栏，因此他们的数据永远不会被覆盖。
I will also add a button that will re-enable the search form if they change their mind.
我还将添加一个按钮，如果他们改变主意，将重新启用搜索表单。
And for the newbies - I put the code in the head of the document like this:
对于新手 - 我将代码放在文档的头部，如下所示：
<html>
<head>
<script type="text/javascript">
$('#seconddiv').live('focus',function(){
$('#firstdiv').attr('disabled', true);
});
</script>
</head>
<body>
....
