Question

这就是我想要做的事情。

当我的表单上点击“提交”表单时，javascript函数将循环遍历表单的所有字段。
对于每个字段，将调用一个函数，该函数将返回true / false以指示它是否已正确填充。
如果返回false，则会在该字段旁边显示错误消息。
如果所有字段都正确，则提交表单。如果没有，则不提交。

这是棘手的部分。虽然大部分验证都是通过javascript完成的，但用户名和电子邮件需要通过ajax进行验证，以查看用户名/电子邮件是否已被使用。

我目前用于此ajax功能的结构与此类似：

function validateSomething()
{
  var valid;
  $.post("something.php", {x:y},
  function(data)
  {
     if (isSomething(data))
       valid=true; 
       //Here referring to the valid variable 
       //set outside this function, in the
       // parent function
     else
       valid=false; 
  });
  return valid/
}

但目前无效。

我能做些什么来使它工作，即我可以阻止validateSomething（）函数返回一个值，直到它被内部函数设置为true / false？

这样的事情会起作用吗？

function validateSomething()
{
  var valid="unset";
  $.post("something.php", {x:y},
  function(data)
  {
     if (isSomething(data))
       valid=true; 
       //Here referring to the valid variable 
       //set outside this function, in the
       // parent function
     else
       valid=false; 
  });
  //Loop without returning until valid is set to true or false
  while (valid=='unset')
  {
     //Do nothing?
  }
  return valid/
}

Answer 1

您可以强制ajax-call等待async：false。

像这样使用jquery：

function validateSomething() {
    var valid;
    $.ajax({
        url: "something.php",
        data: {x: y},
        type: "GET",
        async: false, // this makes the ajax-call blocking
        dataType: 'json',
        success: function (response) {
            valid= response.valid;
        }
     });
     return valid;
}

然而，使用AJAX时的最大胜利是它是异步的。此同步调用可能会在浏览器等待服务器时锁定它。

Answer 2

你可能不想这样做。（或者更恰当地说，“去吧，但这样做时要小心。”）

通过AJAX验证是时髦和光滑，真棒。但它不是验证服务器端的替代品。 AJAx验证是 - 不是服务器端验证。我可以将你的函数返回false并将其翻转为true并愉快地提交表单，即使你检查过以确保用户名不是在服务器上。 Javascript在客户端上运行，无法信任。

实际提交表单时，必须在服务器上重新进行通过AJAX调用进行的任何验证。

如果你这样做，那么，AJAX验证再次，时尚，光滑和令人敬畏。所以去吧。要使用javascript提交表单（例如在AJAX回调处理函数中），您会说：

 if(formwasValid)
 {
      document.getElementById('idOfForm').submit();

      $('#idOfForm').submit(); //jQuery
 }
 else
 {
      alert('Invalid text');
 }

Answer 3

我停止在客户端进行大量的表单验证，因为无论如何必须在服务器端复制代码。

在客户端，我只是通过正则表达式对字段进行一些基本的语法检查。当用户开始输入时，这些检查将立即被触发，但是他们只是在出现问题时发出视觉通知（红色边框，不同的背景颜色，字段旁边的红色'X'）。

我不会阻止用户提交甚至无效的表单：然后，带有更详细检查的服务器端代码开始工作，这可以轻松地重构表单以将有效字段与无效字段分开并生成深入的解释至于检查失败的原因。

使用Javascript + Ajax验证和提交表单

3 个答案: