JQuery Отправить не работает с <a> - PullRequest
Новая
       10

JQuery Отправить не работает с <a>

3 голосов
/ 21 декабря 2011

Я пытаюсь заставить ссылку отправить форму.Почему, когда я называю элемент ввода отправки submit, ссылка больше не работает? 

 //breaks form submission
 <input type="submit" value="Submit" name="submit" />

 //does not break form submission
 <input type="submit" value="Submit" name="xsubmit" />

В Chrome я получаю следующую ошибку: 

Uncaught TypeError: Property 'submit' of object #<HTMLFormElement> is not a function

НЕ работает 

<p>Type 'correct' to validate.</p>
  <form method="post" enctype="multipart/form-data">
    <input type="submit" value="Submit" name="submit" />

    <a id="btn_submit">
        <span id="txt_submit">Submit</span>
    </a>
  </form>

<script>

$("#btn_submit").click(function() {
     $("form").submit();
    });

    $("form").submit(function() {

    });
</script>

РАБОТАЕТ 

 <p>Type 'correct' to validate.</p>
  <form method="post" enctype="multipart/form-data">
    <input type="submit" value="Submit" name="xsubmit" />

    <a id="btn_submit">
        <span id="txt_submit">Submit</span>
    </a>
  </form>

<script>

$("#btn_submit").click(function() {
     $("form").submit();
    });

    $("form").submit(function() {

    });
</script>

Ответы [ 2 ]

12 голосов
/ 21 декабря 2011

«Отправить» - зарезервированное слово. Это конфликтует с JavaScript. Просто измените имя входа на другое.

Из документации jQuery о методе submit () :

Формы и их дочерние элементы не должны использовать входные имена или идентификаторы, которые конфликт со свойствами формы, такими как submit, length или method. Конфликты имен могут привести к сбивающим с толку ошибкам. Для полного списка правила и проверить вашу разметку для этих проблем, см. DOMLint.

5 голосов
/ 21 декабря 2011

Два изменения: 

$(function () {

$("#btn_submit").click(function(e) {
     e.preventDefault();
     $("form").submit();
    });

    $("form").submit(function() {

    });

});

Во-первых, включите привязку в обработчик document.ready $(function () {...}); Во-вторых, добавьте вызов warnDefault для события, чтобы остановить нормальную функциональность привязки.

...