Ответ 1
$('#membershipform').submit(function(event){
// cancels the form submission
event.preventDefault();
// do whatever you want here
});
У меня есть простая форма HTML5, которую я хочу использовать для необходимой проверки поля. Моя проблема заключается в том, что я хочу использовать проверку формы HTML5, но в то же время избегаю фактического представления формы, потому что вместо этого я хочу выполнить jQuery ajax-вызов. Я знаю, что вы можете отключить проверку html5, но я хочу сохранить это в качестве основного метода проверки формы вместо плагина jQuery.
Любые мысли?
HTML
<form action="donothing" id="membershipform" method="get" accept-charset="utf-8">
<input type="text" class="borderr3 innershadow3" name="some_name" value="" id="some_name" placeholder="first and last name" required>
<input type="email" class="borderr3 innershadow3" name="some_name" value="" id="some_name" placeholder="email" required>
<input type="phone" class="borderr3 innershadow3" name="some_name" value="" id="some_name" placeholder="phone" required>
<input type="phone" class="borderr3 innershadow3" name="some_name" value="" id="some_name" placeholder="mailing address" required>
<input type="phone" class="borderr3 innershadow3" name="some_name" value="" id="some_name" placeholder="how you heard about us" required>
<p>
<input type="submit" id="submitbtn" class="submitbtn" value="Continue" style="width:265px">
</p>
</form>
JAVASCRIPT:
$(function(){
$("#submitbtn").click(function(){
$.ajax({
url: "<?php bloginfo('template_url') ?>/ajax-membership.php",
success:
function(txt){
if(txt){
$("#thankyou").slideDown("slow");
}
}
});
});
});
$('#membershipform').submit(function(event){
// cancels the form submission
event.preventDefault();
// do whatever you want here
});
Использование:
$('#membershipform').submit(function(){
// do whatever you want here
return false;
});
Использование чистой java script
<script>
document.getElementById('membershipform').addEventListener("submit", function(e)
{
event.preventDefault();
//write stuff
});
</script>
Это тонкий рычаг поведения по умолчанию и javascript для создания того, что вы хотите.
var form = document.getElementById("purchaseForm");
if(form.checkValidity()){
console.log("valid");
e.preventDefault();
}else{
console.log("not valid");
return;
}
Если форма действительна, то preventDefault() и продолжить с вашей функцией (например, отправить через ajax). Если недействительно, то возвращайте, не предотвращая по умолчанию, вы должны найти действия по умолчанию для проверки формы на входах формы.