Использование onclick и onsubmit вместе

Поместите свой код onClick в ту же функцию, что и код onSumbit.

ОБНОВИТЬ

В конце вашего кода onClick вы return false; , это останавливает нормальное распространение событий и останавливает событие onSubmit от стрельбы. Поэтому, если вы хотите, чтобы кнопка отправки отправила форму, удалите return false; от его обработчика onClick .

Когда вы нажимаете кнопку «Отправить», вы вызываете событие click на кнопке и событие submit в форме, в которой кнопка вложена (если вы не прекратите распространение событий с чем-то вроде return false; ).

Поэтому вам действительно нужен только обработчик событий submit который выполняет работу обоих ваших текущих обработчиков.

Кроме того, поскольку у вас есть jQuery Core, включенный в вашу страницу, вы можете присоединить обработчики событий следующим образом:

 $(function () { $('#form-id').on('submit', function () { var $this = $(this);//$this refers to the form that is being submitted jQuery.facebox({ ajax : 'wishlist.php?emailme=true&name=' + $this.find('#name').val() + '&country=' + $this.find('#country').val() + '&email=' + $this.find('#email').val() + '&department=' + $this.find('#department').val() }); //now we run your normal onSubmit code and return it's return value of this event handler return formCheck(this); }); }); 

Если вы отправляете всю форму в функцию jQuery.facebox вы можете использовать .serialize() jQuery для создания необходимой строки запроса:

 $(function () { $('#form-id').on('submit', function () { jQuery.facebox({ ajax : 'wishlist.php?' + $(this).serialize() }); return formCheck(this); }); }); 

Вот демо: http://jsfiddle.net/vAFfj/

Документы для .serialize() : http://api.jquery.com/serialize

Обратите внимание, что .on() является новым в jQuery 1.7 и в этом случае является таким же, как .bind() более старых версий.

ОБНОВИТЬ

Если вы хотите проверить возвращаемое значение из функции formCheck() перед запуском плагина facebox вы можете сделать это:

 $(function () { $('#form-id').on('submit', function () { //check if the form data is valid if (formCheck(this) === true) { //if the form data is valid then run the facebox plugin jQuery.facebox({ ajax : 'wishlist.php?' + $(this).serialize() }); //also return true to stop running this function return true; } //if the form data is not valid then return false to stop the submission of the form return false; }); }); 

Внесите форму onclick в форму.

Не уверен, что у вас есть особые требования для использования как onSubmit() и onclick() , но это может помочь.

Вот HTML:

 <form id="my_form"> Name: <input type="text" id="name" size="20" /> <br />Country: <input type="text" id="country" size="20" /> <br />Email: <input type="text" id="email" size="20" /> <br />Department: <input type="text" id="dept" size="20" /> <br /><input type="submit" id="submit" value="Login" /> </form> 

И вот JS:

 $(document).ready(function() { $('#my_form').submit(function() { var name = $('#name').val(); var country = $('#country').val(); var email = $('#email').val(); var dept = $('#dept').val(); /* Validate everything */ if (name != '' && country != '' && email != '' && dept != '') { /* Validation succeeded. Do whatever. */ jQuery.facebox({ ajax : 'wishlist.php?emailme=true&name=' + name + '&country=' + country + '&email=' + email + '&department=' + dept }); } else { alert('Validation failed.'); } return false; }); }); 

Теперь вы можете сделать две вещи:

1) Если вы используете AJAX для создания своих форм, вам может потребоваться return false; во второй строке, так как это предотвратит отправку вашей формы.

2) Если вы хотите разместить свою форму в любом случае, просто удалите return false; , Вы также можете публиковать свою форму, используя $('#my_form').submit() когда захотите.

Вот скрипка: http://jsfiddle.net/vAFfj/1/

Надеюсь это поможет.

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

Сначала проверьте, были ли введены все обязательные поля в событии onSubmit, если нет возврата false else, если все обязательные поля были введены, вызовите функцию, выполняющую ту же работу, что и функция в событии onClick.

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

Во-вторых, было бы намного лучше (по многим причинам), если бы действия над атрибутами содержали ссылки на функции, а не встроенный код.

Тем не менее, я бы изменил код следующим образом:

 //some js file included in the page's header function formSubmitActions(element) { if (formCheck(element)) { jQuery.facebox({ ajax : 'wishlist.php?emailme=true&name=' + element.name.value + '&country=' + element.country.value + '&email=' + element.email.value + '&department=' + element.dept.value }); return true; } return false; } //the form <form [...] onsubmit="return formSubmitActions(this)"> [...] 

Надеюсь, поможет!

в вашем коде есть 2 проблемы,

1 – форма может быть представлена ​​нажатием «enter» в любом поле ввода. поэтому событие onclick не будет запущено.

2 – если пользователь нажимает кнопку (при условии, что вы добавили несколько хаков, и запускаются события onclick и onsubmit), но formcheck возвращает false, форма не будет отправлена, но событие click будет успешным ( у вас будет запрос, отправленный в wishlist.php)

мое предложение будет таким, как показано ниже,

 onsubmit = "readyToSubmit(this); return false" function readyToSubmit(a){ if(formCheck(a)){ jQuery.ajax({ url : ..., success : function(data){a.submit()} }) } } 

Теперь вы отправляете форму в событие onclick (jQuery.facebox ({ajax :)), поэтому просто переместите это на обработчик событий отправки (в нижней части функции formCheck после прохождения всех проверок)

 .click(function(e) { e.preventDefault(); // click code }); .submit(function(e) { // submit code }); 

и ajax async param для FALSE

Почему бы просто не объединить их? подача будет отправляться и нажимать, чтобы вы могли сделать

 onsubmit="return formCheck(this);jQuery.facebox({ ajax: (\'wishlist.php?emailme=true&name=\' + this.form.name.value + \'&country=\' + this.form.country.value + \'&email=\' + this.form.email.value + \'&department=\' + this.form.department.value) }); return false;" 

Вы можете сделать одно, просто напишите код для отправки своей формы, например $('#form_id').submit(); , вместо return false; , Таким образом, он будет отправлять форму после завершения функциональности кода .onclick() .

Попробуйте объединить два типа:

 onClick="if (formCheck(this)) { jQuery.facebox({ ajax: (\'wishlist.php?emailme=true&name=\' + this.form.name.value + \'&country=\' + this.form.country.value + \'&email=\' + this.form.email.value + \'&department=\' + this.form.department.value) });} return false;"