jquery - 使用 AJAX/JQUERY 验证多个输入并更改输入的 css

Question

我有一个表单，其中包含多个具有相同名称和方括号的输入，例如:

<input name=foo[] id=foo[]/>

我使用括号将输入处理为 PHP 的数组，因为输入的数量不固定。

我正在尝试使用 AJAX/JQUERY 添加一些表单验证，因为每个输入必须包含数据库中已有的值。检查后，我想将输入的 CSS 更改为绿色(如果正确则为绿色，如果错误则为红色)。

AJAX 部分工作正常，但我无法让 JQUERY 单独更改输入的 CSS(所有输入都已更改)；

这是我使用的代码:

<script>
  $(document).change(function() {
    $('input[id="foo[]"]').each(function() {
      $(this).change(validate);
    });
  });

  function validate() { 
    var foo = $(this).val();
    if(foo == "" || foo.length < 4) {
      $('input[id="foo[]"]').css('border', '3px #C33 solid');
    } else {
      jQuery.ajax({
        type: "POST",
        url: "common/check.php",
        data: 'foo='+ foo,
        cache: false,
        success: function(response) {
          if(response == 0) {
            $('input[id="foo[]"]').css('border', '3px #C33 solid');
          } else {
            $('input[id="foo[]"]').css('border', '3px #00FF00 solid');
          }
        }
      });
    }
  }
</script>

感谢您的帮助!

Answer 1

尝试去掉「"」。

$('input[id=foo[]]').css('border', '3px #C33 solid');