jQuery submit () - событие для переопределения действия формы

Question

У меня есть форма, и у меня есть некоторый код jquery для переопределения процесса отправки.Но это не работает и нет ошибок.Я упростил пример кода, надеюсь, я не сделал опечаток.

Кто-нибудь знает, что не так с кодом?Дело не доходит до того, что я получаю предупреждение ().Событие click () работает нормально.

Я попытался установить идентификатор формы.все еще ничего.

Использование jquery-1.4.2.min.js

  <form name="checkout_shipping" action="checkout.php" method="post">
    <div class="contentText">
      <table border="0" width="100%" cellspacing="0" cellpadding="2">
        <tr onmouseover="rowOverEffect(this)" onmouseout="rowOutEffect(this)" onclick="selectRowEffect(this, 0); document.checkout_shipping.submit();">
          <td width="75%" style="padding-left: 15px;">Flat price</td>
          <td>$8.00</td>
          <td align="right"><input type="radio" name="shipping" value="flat_flat" onclick="this.form.submit();" /></td>
        </tr>
        <tr onmouseover="rowOverEffect(this)" onmouseout="rowOutEffect(this)" onclick="selectRowEffect(this, 1); document.checkout_shipping.submit();">
          <td>Pick-up</td>
          <td>$0.00</td>
          <td align="right"><input type="radio" name="shipping" value="pickup_pickup" checked="checked" onclick="this.form.submit();" /></td>
        </tr>
      </table>
    </div>
  </form>

  <script>
    $('form[name=checkout_shipping]').submit(function(e) {
      e.preventDefault();
      alert('Houston we have contact!');
      $.ajax({
        url: '/includes/checkout/payment.php',
        data: false, // false for testing
        type: 'POST',
        cache: false,
        async: false,
        dataType: 'html',
        error: function(jqXHR, textStatus, errorThrown) {
          // ...
        },
        success: function(data) {
          // ...
        }
      });
    });
  </script>

Answer 1

То, как вы отправляете форму, обходит организаторов.

Вместо:

 document.checkout_shipping.submit();

1005 * * Используйте

 $(this).closest('form').submit();

См. http://jsfiddle.net/6uZuS/

Полный код:

<form name="checkout_shipping" action="checkout.php" method="post"> 
    <div class="contentText"> 
        <table border="0" cellspacing="0" cellpadding="2"> 
            <tr onmouseover="rowOverEffect(this)" onmouseout="rowOutEffect(this)" onclick="selectRowEffect(this, 0); $(this).closest('form').submit();"> 
                    <td width="75%" style="padding-left: 15px;">Flat price</td> 
                    <td>$8.00</td> 
                    <td align="right"><input type="radio" name="shipping" value="flat_flat" onclick="$(this).closest('form').submit();" /></td> 
                </tr> 
                <tr onmouseover="rowOverEffect(this)" onmouseout="rowOutEffect(this)" onclick="selectRowEffect(this, 1); $(this).closest('form').submit();"> 
                    <td>Pick-up</td> 
                    <td>$0.00</td> 
                    <td align="right"><input type="radio" name="shipping" value="pickup_pickup" checked="checked" onclick="$(this).closest('form').submit();" /></td> 
                </tr> 
            </table> 
        </div> 
</form> 


 <script type="text/javascript">
      $(document).ready(function(){
           $('form[name=checkout_shipping]').submit(function(e) { 
                e.preventDefault();
                alert('Got you!');
           });
      });
 </script>

Answer 2

Вы можете проверить здесь или

<form name="checkout_shipping" id="checkout_shipping" action="checkout.php" method="post">
    <div class="contentText">
      <table border="0" width="100%" cellspacing="0" cellpadding="2">
        <tr onmouseover="rowOverEffect(this)" onmouseout="rowOutEffect(this)" onclick="selectRowEffect(this, 0);">
          <td width="75%" style="padding-left: 15px;">Flat price</td>
          <td>$8.00</td>
          <td align="right"><input type="radio" name="shipping" value="flat_flat" onclick="$(this).parents('form').submit();" /></td>
        </tr>
        <tr onmouseover="rowOverEffect(this)" onmouseout="rowOutEffect(this)" onclick="selectRowEffect(this, 1);">
          <td>Pick-up</td>
          <td>$0.00</td>
          <td align="right"><input type="radio" name="shipping" value="pickup_pickup" checked="checked" onclick="$(this).parents('form').submit();" /></td>
        </tr>
      </table>
    </div>
  </form>
<script>
$(document).ready(function(){
$('#checkout_shipping').submit(function(e) {
      e.preventDefault();
      alert('Houston we have contact!');
});
})
</script>