javascript - 如果输入值符合要求，则添加html属性

Question

假设我有两个输入。当我在 input1 中键入值例如 0.4 并满足要求时，input2 将删除 readonly 属性。同时，如果我在 input1 中输入的值为 0.3，那么 input2 属性将再次变为只读。

它不起作用。也许我在这里错过了什么

$(".input1").keydown(function() {
    var dInput = $(this).val();
    if (dInput >= 0.4 && dInput <= 0.6) {
        $(".input2").attr('readonly', true);
    } else {
        $(".input2").removeAttr("readonly");
    }
});

function isNumberKey(e) { // stub
    return true;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" class="input1" onkeypress="return isNumberKey(event)" id="input1" name="input1" value="" />

<input type="text" class="input2" onkeypress="return isNumberKey(event)" id="input2" name="input2" value="" readonly />

Answer 1

1:使用 keyup 函数，因为值稍后会填入字段中，而您正试图在 keydown 处捕获

2:我已经根据您的描述切换了 if 和 else block 语句。您的原始代码与您在这里所说的相矛盾。

        $(".input1").keyup(function() {

            var dInput = $(this).val();
            if(dInput >= 0.4 && dInput <= 0.6)
            {
                $(".input2").removeAttr("readonly");
            }
            else
            {
                $(".input2").attr('readonly',true);
            }
        });

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" class="input1" o id="input1" name="input1" value="" />

<input type="text" class="input2"  id="input2" name="input2" value="" readonly />