submit() 根本不触发

Question

我不确定为什么 submit() 根本没有触发。单击事件和基础 AJAX 调用工作正常，但表单未提交。我也试过$("#storeForm").unbind().submit();也没有效果

$(document).on("click", '#submit', function(e) {
  e.preventDefault();
  var frm = $("#storeForm");
  var address = $("#address").val();
  var state = $("#state option:selected").text();
  var city = $("#city").val();
  var country = "USA";
  var addressToSearch = state + " " + state + " " + country;
  var urlGeoCode = 'https://maps.googleapis.com/maps/api/geocode/json?key=AIzaSyAfAyG4l207wcJUn-D8XsOUZvCSwJv27zs&&address=' + addressToSearch;

  jQuery.ajax({
    url: urlGeoCode,
    success: function(result) {
      var location = result.results[0].geometry.location;
      $("#longitude").val(location.lng);
      $("#latitude").val(location.lat);
      $('#storeForm').submit();
    },
  });
});

已编辑： 结果 resultOutput 为正确的格式

Answer 1

浏览器的这个很棒功能可以将您的 id="submit" 转换为表单上的属性。这具有覆盖表单节点的 .submit 方法的不幸副作用，这就是 jQuery 无法提交所述表单的原因。

解决方案当然是删除 id="submit"，可能用其他东西替换它或以不同的方式处理提交。

Answer 2

您的问题与 submit() 事件的触发完全无关。如果您检查控制台，您会看到一个错误：

resultOutput is not defined

这是因为您在 success 处理程序中访问响应文本的方式存在语法错误。结果，submit() 甚至没有被调用。

要解决此问题，您需要将 var location = resultOutput.geometry.location; 更改为 var location = result.results[0].geometry.location;。这将在提交表单之前获得正确的数据。试试这个：

$(document).on("click", '#submit', function(e) {
  var urlGeoCode = 'https://maps.googleapis.com/maps/api/geocode/json?key=AIzaSyAfAyG4l207wcJUn-D8XsOUZvCSwJv27zs&&address=Florida Florida Orlando';

  jQuery.ajax({
    url: urlGeoCode,
    success: function(result) {
      var location = result.results[0].geometry.location;
      $("#longitude").val(location.lng);
      $("#latitude").val(location.lat);
      $('#storeForm').submit();
    }
  });
});

$('#storeForm').on('submit', function(e) {
  e.preventDefault();
  console.log('form submission...');
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<form id="storeForm">
  <input type="text" id="longitude" />
  <input type="text" id="latitude" />
</form>

<button type="button" id="submit">Get location...</button>

submit() 根本不触发

submit() is not triggering at all

ajax

jquery

form-submit