2014-02-21 7 views
40

Я пытаюсь запустить функцию с помощью Jquery, когда нажата кнопка отправки формы, но функция должна запускаться до того, как форма будет отправлена.JQuery функция ПЕРЕД отправкой формы

Я пытаюсь скопировать некоторые атрибуты тега div в скрытые текстовые поля при отправке, а затем отправить форму.

Мне удалось заставить это работать, используя функцию mouseover (когда кнопка отправки зависла), но это не будет работать на мобильных устройствах, используя touch.

$("#create-card-process.design #submit").on("mouseover", function() { 
    var textStyleCSS = $("#cover-text").attr('style'); 
    var textbackgroundCSS = $("#cover-text-wrapper").attr('style'); 
    $("#cover_text_css").val(textStyleCSS); 
    $("#cover_text_background_css").val(textbackgroundCSS); 
}); 

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

Большое спасибо

+3

Параметр 'submit' событие (по форме) должны выполняться при нажатии на кнопку отправки, и он будет работать до того, как форма представляется изначально. Вы также можете попробовать использовать событие 'click' на самой кнопке отправки. –

+0

Какие у вас проблемы с функцией 'submit', я не понимаю ваше последнее предложение. Что означает «значения не сохраняются в полях»? У вас есть какой-либо другой JavaScript (возможно, подтверждение) в форме? –

+0

Можете ли вы дать нам скрипку? Если вы хотите, чтобы анимация запускалась перед отправкой, использование опции «timeout» также является опцией. –

ответ

64

Вы можете использовать onsubmit функцию.

Если вы вернетесь, то форма не будет отправлена. Читайте об этом here.

$('#myform').submit(function() { 
    // your code here 
}); 
+0

спасибо! Должна ли быть включена функция .submit внутри: $ (document) .ready() или я могу пойти в любом месте в файле javascript? – BKSpurgeon

+0

$ (document) .ready (function() { $ ('# FrmLogin'). Submit (function() { $ ("# DomainUserName"). Val ($ ("# DomainUserName"). Val() + '@ pawan.in'); }); }); –

2

Aghhh ... я не хватало какой-то код, когда я впервые попробовал функцию .submit .....

Это работает:

$('#create-card-process.design').submit(function() { 
var textStyleCSS = $("#cover-text").attr('style'); 
var textbackgroundCSS = $("#cover-text-wrapper").attr('style'); 
$("#cover_text_css").val(textStyleCSS); 
$("#cover_text_background_css").val(textbackgroundCSS); 
}); 

Спасибо за все комментарии.

+0

О, хорошо. Всегда тщательно отлаживайте отладку. – kartikluke

4

Вы можете использовать некоторый div или span вместо кнопки, а затем щелкнуть по вызову некоторой функции, которая отправляет форму в конце.

<form id="my_form"> 
    <span onclick="submit()">submit</span> 
</form> 

<script> 
    function submit() 
    { 
     //do something 
     $("#my_form").submit(); 
    } 
</script> 
+8

Осторожно, это не удастся, если пользователь нажмет [Enter] на одно из полей – oriadam

21
$('#myform').submit(function() { 
    // your code here 
}) 

Выше НЕ работает в Firefox . Форма просто будет отправлена ​​без запуска вашего кода. Также аналогичные вопросы упоминаются в другом месте ... например, this question. Обходной будет

$('#myform').submit(function(event) { 

event.preventDefault(); //this will prevent the default submit 

    // your code here 

$(this).unbind('submit').submit(); // continue the submit unbind preventDefault 
}) 
0

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

Это полный код, который нужно:

Добавить идентификатор «yourid» в HTML тег формы.

<form id="yourid" action='XXX' name='form' method='POST' accept-charset='UTF-8' enctype='multipart/form-data'> 

код JQuery:

$('#yourid').submit(function() { 
    // do something 
}); 
Смежные вопросы