Question

编辑：所以我最终在这里得到了这个代码，但是一如既往，不能让它正常工作。基本上它必须检查所有输入字段是否已填满，一旦此检查为真，它将调用JSON URL以检查增值税号的有效性。如果增值税号检查返回true，则提交表单，否则它会通知客户有错误并让客户选择是否忽略该异常（然后提交）或取消提交并留在页面上。这是JS代码，下面是从调用返回的JSON。

$(document).ready(function() {
$('#create_customer').submit(function(){
  var canSubmt = true;
  $("form#create_customer :input").each(function(){
    var input = $(this);
    if($(input).val() == '') {
      $(input).css("border",'1px solid red');
      canSubmt = false;
    }else{
      $(input).css("border",'1px solid #000');
    }
  });
  if(!canSubmt){ $("#errMsg").text("Errors detected! Please check your form and try again.").show().fadeOut(7000); return canSubmt; }

  var vatNum = document.getElementById('VatNum').value;
  var validVat;
  var vatConfirm;

  $.getJSON("http://apilayer.net/api/validate?&access_key=<api-key>&vat_number="+vatNum, function(response) {
    validVat = response.valid;
  })
  .fail(function(){
    console.log("failed");
  });

  if (!validVat) { vatConfirm = confirm("Your VAT number doesn't seem to be valid or in a correct format!\nDo you wish to continue anyway?"); }
  if (!vatConfirm) { canSubmt = false; }

  return canSubmt;
});

}）;

和JSON数据，我只需要＆＃34;有效＆＃34;键：

{ "valid": true, "format_valid": true, "query": "LU26375245", "country_code": "LU", "vat_number": "26375245", "company_name": "AMAZON EUROPE CORE S.A R.L.", "company_address": "5, RUE PLAETIS L-2338 LUXEMBOURG" }

关于如何使这个工作的任何想法？

Answer 1

这是两个问题：

Ajax是异步的，所以在它返回值validVat之前执行可能已经达到了返回语句
validVat的范围在ajax函数内部，因此它将在“return ...”行中未定义。

您可以做的最简单的事情是使ajax请求同步，请参阅以下内容：

var validVat = false;
$.ajax({
    var vatNumber = document.getElementById("VatNum").value;
    url: 'http://apilayer.net/api/validate?access_key=6ab1579cc9e968a65429d7f351375f35&vat_number='+vatNumber,   
    dataType: 'jsonp',
    async: false,
    success: function(json) {

      // Access and use your preferred validation result objects
      if (!json.valid) {
        var r = confirm("Your VAT number doesn't seem to be valid or in a correct format!\nDo you wish to continue anyway?");
        if (r == true) {
          validVat = true;
        } else {
          validVat = true;
        }
      }
    }
  });

  return validVat;

最好的事情是，应该使用回调函数来提交表单或在响应ajax请求后执行任何操作。

这是一个模拟ajax请求的完整示例，请参阅以下内容：

var validated = false;

$("form").submit(function( event ) {
  
  if(!validated){
    event.preventDefault();
    
    var mock = {
      ajax: function() {
        return mockAjax({
          success: $("#test").val() === "correct",
          response: { ok: $("#test").val() === "correct" },
          timeout: 500
        });
      }
    };

    mock.ajax()
    .done(function(valid) {
      if(valid) {
        $("#err").text("Validated... do submit").show();
        validated = true;
        return $("form").submit();
      } else {
        event.preventDefault();
      }
    })
    .error(function(json) {
      $("#err").text("Not valid!").show().fadeOut(1000);
    });
  }
});

function mockAjax(options) {
  var that = {
    done: function done(callback) {
      if (options.success)
        setTimeout(callback, options.timeout, options.response);
      return that;
    },
    error: function error(callback) {
      if (!options.success)
        setTimeout(callback, options.timeout, options.response);
      return that;
    }
  };
  return that;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>Type 'correct' to validate.</p>
<form action="javascript:console.log( 'success!' );">
  <div>
    <input id="test" type="text">
    <input type="submit">
  </div>
</form>
<span id="err"></span>

我希望它可以帮助你，再见。

Ajax JSON故障

1 个答案: