Question

我有两个输入字段。除非我在第一个文本字段中输入内容，否则我想禁用第二个输入字段。一旦我在第一个文本字段中输入内容，就应该启用第二个输入字段。目前我正在尝试这样做，但它没有按预期工作。

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Untitled Document</title>
</head>

<body>
<input type="text" id="value1" />
<input type="text" id="value2" />

<script>
    var val1 = Number(document.getElementById('value1').value)
    var val2 = Number(document.getElementById('value2').value)
    if(document.getElementById('value1').value===null ||document.getElementById('value1').value===''){
            document.getElementById('value2').disabled = true 
        }
        else{document.getElementById('value2').disabled = false }
</script>

</body>
</html>

我是javascript的新手。我需要一些帮助。

Answer 1

anwser应该现在正在工作：

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Untitled Document</title>
</head>

<body>
<input type="text" id="value1" onkeyup="myFunction()"/>
<input type="text" id="value2" disabled="disabled" />

<script>
function myFunction() {
  var val1 = Number(document.getElementById('value1').value)
  var val2 = Number(document.getElementById('value2').value)
  if(document.getElementById('value1').value===null ||document.getElementById('value1').value===''){
    document.getElementById('value2').disabled = true 
  }else {
    document.getElementById('value2').disabled = false 
  }
}
</script>

</body>
</html>

Answer 2

添加event listener并检查第一个字段值以更改第二个字段的状态：

＆＃13;

var val1 = document.getElementById('value1');

val1.addEventListener('keyup', function() {
    document.getElementById('value2').disabled = val1.value === "";
});

＆＃13;

<input type="text" id="value1" />
<input type="text" id="value2" disabled />

＆＃13;

Answer 3

试试这个，我打电话给onchange函数，

var val1 = Number(document.getElementById('value1').value)
    var val2 = Number(document.getElementById('value2').value)
    if(document.getElementById('value1').value===null ||document.getElementById('value1').value===''){
            document.getElementById('value2').disabled = true; 
        }
        else{document.getElementById('value2').disabled = false }

            function enableInput(argument) {
                debugger
                var values = document.getElementById('value1').value
                if (values.length>0) {
                    document.getElementById('value2').disabled = false;
                }else{
                    document.getElementById('value2').disabled = true;

                }
            }

Answer 4

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Untitled Document</title>
</head>
<body>
<input type="text" id="value1"  onblur="Call()"/>
<input type="text" id="value2" />
<script>
    var val1 = Number(document.getElementById('value1').value)
    var val2 = Number(document.getElementById('value2').value)
    document.getElementById('value2').disabled = true

function Call()
{
     if(document.getElementById('value1').value===null ||document.getElementById

('value1').value===''){
            document.getElementById('value2').disabled = true 
        }
        else{document.getElementById('value2').disabled = false }
}

</script>

</body>
</html>

输入字段未被禁用或根据需要启用

4 个答案: