Question

我的注册表格如下：

<div class="form">
    <form class="register-form" name="register-form">
        <ul class="errorMessages"></ul>
         <div class="user-name">
             <input class="wrap" name="firstname" type="text" placeholder="firstname" required/>
              <input class="wrap" name="lastname" type="text" placeholder="lastname" required/>
              </div>
          <input name="password" type="password" placeholder="password" autocomplete="off" required/>
          <input name="email" type="text" placeholder="email address" autocomplete="off" required/>
          button class="btn-signup" type="submit">Create</button>
          <p class="message">Already registered? <a href="#">Sign In</a></p>
</div>

我创建JQuery代码检查输入是否为空，这将创建错误消息＆＃34;

$(function() {
    var createAllErrors = function () {
        var form = $(".register-form");
        var errorList = $('ul.errorMessages', form);

        var showAllErrorMessages = function () {
            errorList.empty();

            form.find(':invalid').each(function (index, node) {
                var label = $('input').attr('name');
                var message = node.validationMessage || 'Invalid value.';
                errorList
                    .show()
                    .append('<li><span>' + label + ': ' + '</span>' + message + '</li>');
            });
        };
        $('input[type=submit], button', form).on('click', showAllErrorMessages);
    };
    $('form').each(createAllErrors);
});

但是当我按下按钮时我有结果：

有关标签变量的任何问题吗？或在表格上找到无效的输入？

Answer 1

错误发生在每个循环中。你永远不会使用当前索引，而是重新查询整个dom以搜索input元素。当你在jQuery集合上调用getter函数时，jQuery将返回集合中第一个元素的属性。在您的情况下，这是firstname输入元素。改为使用每个循环的当前元素：

form.find(':invalid').each(function (index, node) {

  // WRONG: This will always return firstname
  //var label = $('input').attr('name');

  // RIGHT: Access the current element inside each loop
  var label = $(node).attr('name');

  // ...
});

Answer 2

您需要找到“无效”的“每个”输入。以下行在您当前的代码中存在问题。

    $(function() {
    var createAllErrors = function () {
       var form = $(".register-form");
       var errorList = $('ul.errorMessages', form);

       var showAllErrorMessages = function () {
       errorList.empty();

       form.find(':invalid').each(function () {
            // for each invalid input find it's attribute 'name'
            var label = $(this).attr('name');
            var message = $(this).validationMessage || 'Invalid value.';
            errorList
                .show()
                .append('<li><span>' + label + ': ' + '</span>' + message + '</li>');
            });
       };
       $('input[type=submit], button', form).on('click', showAllErrorMessages);
    };
    $('form').each(createAllErrors);
});

以下应该解决您的问题，

NotificationCompat.Builder mBuilder =
   new NotificationCompat.Builder(this)
   .setSmallIcon(R.drawable.notification_icon)
   .setContentTitle("My notification")
   .setContentText("Hello World!");

如何使用jQuery创建错误消息验证表单输入？

2 个答案: