Question

我有以下脚本与keyup函数配合良好。我还希望它在加载时检查输入值，但无法使其正常工作。

<input type="text" id="test" value="30">
<p style="display:none;" id="error">Error</p>

<script>

$(function() {
    $("#test").keyup(function(){
        if( $(this).val() != '20') {
            $("#error").show();
            } else {
            $("#error").hide();
            }
    });
});

</script>

有人可以帮忙吗？

Answer 1

实现此目的的最简单方法是在页面加载时引发事件，您可以通过使用不带参数的keyup()来实现这一点。另请注意，使用toggle()：

可以使您的逻辑更加简洁

$(function() {
  $("#test").keyup(function() {
    $('#error').toggle($(this).val() != '20');
  }).keyup();
});

#error { display: none; }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="test" value="30" />
<p id="error">Error</p>

Answer 2

使其成为您在加载和加密时调用两者的功能，例如：

$(function() {
    function checkTest(el) {
        if( el.val() != '20') {
            $("#error").show();
        } else {
            $("#error").hide();
        }
    }
    checkTest($("#test").keyup(function() {
        checkTest($(this));
    }));
});

虽然可以通过在元素上触发合成keyup事件来完成它，但与单纯调用该函数相比，我从未关心过它。

如果这有点令人反感：

checkTest($("#test").keyup(function() {
    checkTest($(this));
}));

......你可以将它们分开：

checkTest($("#test"));
$("#test").keyup(function() {
    checkTest($(this));
});

前者是因为jQuery＆＃34; chaining＆＃34; API，因此设置处理程序的keyup调用的返回值将传递到checkTest。

Answer 3

$(function() {
  $("#test").keyup(function() {
    if ($(this).val() != '20') {
      $("#error").show();
    } else {
      $("#error").hide();
    }
  });
  $("#test").keyup();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="test" value="30">
<p style="display:none;" id="error">Error</p>

jQuery在文档加载上运行

3 个答案: