在Jquery如何运行代码与回调前提交 [英] in Jquery how to run code with callback before submit

问题描述

我需要在提交表单之前运行一些jquery代码，似乎有一些问题。

I need to run some jquery code before submitting a form and there seem to be some issues.

只是在你急于推荐这个之前听我说： p>

Just hear me out before you rush to recommend this:

$(function() {
     $('form').submit( function() {
         /* some code */
         return true;
     });
});

我需要，按下提交按钮之后，首先计算地址的经度和纬度变量google API然后提交表单。这需要在回调函数中侦听响应。

I need , after pressing the "submit" button first calculate the longtitude and latitude variables of an address using google API and then submit the form. That requires listening for a response in a callback function.

我到目前为止的代码如下：

The code I have so far looks like this:

  $("form input:submit").click(function(e){
      e.preventDefault();
      var address = $(this).find('.address').val();
      geocoder.geocode( { 'address': unescape(address)}, function(results, status) 
      {
          if (status == google.maps.GeocoderStatus.OK) 
          {
            $(".latSelector input:hidden").val(results[0].geometry.location.lat());
            $(".lngSelector input:hidden").val(results[0].geometry.location.lng());
            $("form").submit();
          }
       });  
  });

如果我使用submit函数做同样的操作，表单在回调函数触发之前提交并且后面的代码使用缺失值执行。

If I do the same using the "submit" function, the form submits before the callback function is triggered and the code behind executes with missing values.

如果我使用按钮上的点击事件，像上面的代码，手动提交，那么代码执行正确，但提交不触发后面的代码形式。

If I use the "click" event on the button like the code above and submit manually, then the code executes correctly but the submit doesn't trigger the code behind of the form.

我想我接近这个工作，但我找不到魔术组合将运行代码，处理回调值，然后提交

I think I am close to getting this to work but I can't find the magic combination that will run the code, process the callback values and then submit the form correctly, so that the code behind executes.

推荐答案

您应该使用提交事件，而不是单击事件的按钮。某些浏览器允许在不使用提交按钮的情况下提交表单，只需在表单中的某些字段具有焦点时按Enter键。

You should use the submit event on the form, not the click event of the button. Some browsers allow the form to be submitted without using the submit button by just pressing enter when some field in the form has focus.

preventDefault 方法将停止提交表单，以便以后可以提交：

The preventDefault method will stop the submitting of the form, so that you can submit it later:

$("form").submit(function(e){
  e.preventDefault();
  var address = $(this).find('.address').val();
  geocoder.geocode( { 'address': unescape(address)}, function(results, status) 
  {
      if (status == google.maps.GeocoderStatus.OK) 
      {
        $(".latSelector input:hidden").val(results[0].geometry.location.lat());
        $(".lngSelector input:hidden").val(results[0].geometry.location.lng());
        $("form")[0].submit();
      }
   });  
});

编辑：

使用按钮，您需要记录提交表单的原因：

To submit the form using the button, you need to keep track of why the form is submitted:

var reason = 'user';

$("form").submit(function(e){
  if (reason == 'user') {
    e.preventDefault();
    var address = $(this).find('.address').val();
    geocoder.geocode( { 'address': unescape(address)}, function(results, status) 
    {
      if (status == google.maps.GeocoderStatus.OK) 
      {
        $(".latSelector input:hidden").val(results[0].geometry.location.lat());
        $(".lngSelector input:hidden").val(results[0].geometry.location.lng());
        reason = 'callback';
        $("form input:submit").click();
      }
    });
  }
});

这篇关于在Jquery如何运行代码与回调前提交的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！