Question

我不知道如果我用这块瓷砖清楚自己，我认为这很令人困惑，但让我解释一下。所以我有js代码：

function validateUserLogin() {
  'use strict';
  var xmlhttp, url = '../controller.php?action=validatelogin',
  email = document.getElementById('email').value,
  password = document.getElementById('password').value;
  if (window.XMLHttpRequest) {
      xmlhttp = new XMLHttpRequest();
  } else if (window.ActiveXObject) {
      xmlhttp = new ActiveXObject('Microsoft.XMLHTTP');
  } else {
      alert('Your browser does not support XMLHTTP!');
  }
  xmlhttp.open('POST', url, true);
  xmlhttp.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
  xmlhttp.send('email=' + email + '&password=' + password);
  xmlhttp.onreadystatechange = function () {
      if (xmlhttp.readyState === 4 && xmlhttp.status === 200) {
          if (xmlhttp.responseText === 'Error1') {
              $('#email').css('border', '1px solid red');
              //A value to return
          }
          if (xmlhttp.responseText === 'Error2') {
              $('#email').css('border', '1px solid green');
              $('#password').css('border', '1px solid red');
              //A value to return
          }
      }
  };
  //I want it here
}

在上面的代码中，我有一个功能，用于在用户尝试登录发送ajax请求时验证用户。在服务器端脚本中，当电子邮件或密码不正确时，我会回显消息，并将输入的边框颜色更改为绿色或红色。到现在为止还挺好。我想要的是从子函数内部的2个ifs返回一个变量到validateUserLogin然后返回一个true或false到登录表单。这甚至可能吗？

Answer 1

只需使用之前声明的var？（stored这里）

您可以使用xmlhttp.open('POST', url, false);作为同步请求发送。

我用加载侦听器替换了你的.onreadystatechange，在这个小提琴上为我工作：https://jsfiddle.net/1ma3svcd/ 调用的PHP文件只返回＆＃39; Error1＆＃39;。

var xmlhttp;

function validateUserLogin() {
  'use strict';
  var stored;
  var url = 'https://zenoo.fr/testAjax.php',
  email = 'test@test.tes',
  password = 'testMe';
  if (window.XMLHttpRequest) {
      xmlhttp = new XMLHttpRequest();
  } else if (window.ActiveXObject) {
      xmlhttp = new ActiveXObject('Microsoft.XMLHTTP');
  } else {
      alert('Your browser does not support XMLHTTP!');
  }

  xmlhttp.addEventListener("load", transferComplete, false);
  xmlhttp.open('POST', url, false);
  xmlhttp.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
  xmlhttp.send('email=' + email + '&password=' + password);
}

function transferComplete(){
      if (xmlhttp.responseText === 'Error1') {
        $('#email').css('border', '1px solid red');
        stored=true;
      }
      if (xmlhttp.responseText === 'Error2') {
        $('#email').css('border', '1px solid green');
        $('#password').css('border', '1px solid red');
        stored=false;
      }

      console.log(stored);
}


validateUserLogin();

Answer 2

这是不可能的，因为HttpRequest是异步的。意味着你的函数不会在返回值之前等待Request完成。

我不知道你要在这里实现什么，但我怀疑方法validateUserLogin()正在表单的onsubmit处理程序中使用。

如果是这种情况，那么我建议您使用事件监听器

例如：

var form = document.getElementById('login-form');
form.addEventListener('submit', function(e){
    // Prevent form from loading the page (submit)
    e.preventDefault();

    // Then call your function here
    // If user was logged in without errors,
    // You can use in your function "window.location.href = 'http://mywebapp.dev/dashboard'"
    validateLogin();
});

Answer 3

@Zenoo回答不起作用，因为你不能：Ajax是异步的，这意味着当你到达最后一行（“//我希望它在那里”）时，浏览器可能还没有发送Ajax请求。

您可以传递回调函数

使用javascript从main函数内的子函数返回一个值

3 个答案: