根據JS中的輸入值顯示警報？

Question

我有一個ID為pc-verify的輸入：

<%= form.text_field :address2, :id => 'pc-verify' , :class => 'required' %>

如果用戶填寫值“ 28028”，並且沒有提交表單，我想顯示一個警報。

我該如何實現？

我試過了：

  <script> 
    if ($("#pc-verify").value == "28028") {
          alert("hey");
    };
  </script>

編輯

<script>
    $(function(){
        $(".pc-verify").on('change', function(e){
            if ($(".pc-verify").value == "28028") {
                  alert("hey");
            }
        });
    });
</script>

Answer 1

使用getElementById() ，然后如果需要原生 javascript，則使用value屬性

if (document.getElementById("pc-verify").value == "28028") {
          alert("hey");
    }

或者 ，如果您使用的是jQuery ，請使用val()

if ($("#pc-verify").val() == "28028") {
              alert("hey");
        }

最后，您可以將它們包裝在submit處理程序中

$('form').submit(function(){
    if ($("#pc-verify").val() == "28028") {
         alert("hey");
         return false;//to prevent the form from being submitted
    }
});

Answer 2

無需提交表單，您可以使用輸入的change事件

$("#pc-verify").on('change', function(e){
    if ($("#pc-verify").val() == "28028") {
          alert("hey");
    }
});

這樣，當用戶鍵入值並離開字段時，將進行值檢查。 您也可以在keyup上執行此操作，這將檢查該輸入中釋放的每個鍵

$("#pc-verify").on('keyup', function(e){
    if ($("#pc-verify").val() == "28028") {
          alert("hey");
    }
});

您的腳本位於script標簽內，但不在文檔就緒處理程序內，在jquery中，您必須這樣做，以便僅在頁面加載完成后才執行腳本

<script>
$(function(){
    $("#pc-verify").on('keyup', function(e){
        if ($("#pc-verify").val() == "28028") {
              alert("hey");
        }
    });
});
</script>