Question

尝试构建一个函数，其中至少需要一对字段对 s_AAA / s_BBB 才能提交表单。用户最多可以提交5个 s_AAA / s_BBB 组合。您可以将此视为最多可以推荐五位朋友的表单，但必须至少提交一份表单才能提交。

感谢任何帮助！

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  <script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.9/jquery.validate.min.js"></script>
  <script type="text/javascript">      
     (function ($, W, D) {
         var SIGNUPVALIDATION = {};

         SIGNUPVALIDATION.UTIL = {
             setupFormValidation: function () {
                 //form validation rules
                 $("#friend_req").validate({
                     rules: {
                         s_referee_email: "required",
                         s_referee_fname: "required", 

                     },
                     messages: {
                         s_referee_email: "Please enter at least one friend's email address",
                         s_referee_fname: "Please enter your friends first name",
                     },
                     submitHandler: function (form) {
                         form.submit();
                     }
                 });
             }
         }
         //when the DOM has loaded setup form validation rules
         $(D).ready(function ($) {
             SIGNUPVALIDATION.UTIL.setupFormValidation();
         });

     })(jQuery, window, document);
  </script>

Answer 1

除非您特别想在javascript中执行此操作，否则您只需将required添加到HTML5表单即可。例如：

<input type="text" name="usrname" required>

然后问题变成Safari - 如果必填字段留空，则不会提交表单 - 但也不会向用户呈现错误。您的用户将坐在那里，不知道表单无法提交的原因。在这种情况下，您可以使用一些JS来做到这一点。您可能会问为什么不在JS中执行此操作并跳过HTML验证？嗯，我认为这是个人决定，但我喜欢使用组合方法，因为我喜欢HTML验证在其他浏览器中提供的小popovers。

如果您要在JS中执行此操作，您将创建一个函数来抓取您想要验证的输入，如下所示：

nameInput   = document.querySelector("#name").value

从那里你可以检查输入是否有一个长度，如果你想确保它满足一定的最小字符，或者你可以检查它是否有一个使用.test()的值的东西像：

/^[a-zA-Z]+/.test(nameInput)

从那里开始，如果是，则继续提交，如果没有，则向用户发出错误：

*assuming you have a div with a class of "error", if not you could create one dynamically

else {
  error.innerHTML = "You must provide a name.";
}

如何制作第一对字段，不需要休息

1 个答案: