这是我的代码:
<script type="text/javascript">
jQuery(document).ready(function(){
// binds form submission and fields to the validation engine
jQuery("#formIDRegister").validationEngine(); //--> this is the jQuery Validation Engine. The code below has no relation with it.
});
function func(){
$(document).ready(function() {
$(document).ajaxStop($.unblockUI);
$("#formIDRegister").submit(function() {
$("input[type=submit]").attr("disabled", "disabled");
$.blockUI({message: '<h1><img src="./images/misc/ajax-loader.gif" /> Espere um momento...</h1>'});
var trueName = $("#trueName").val();
var trueSurname = $("#trueSurname").val();
var phoneHomeCountryId = $("#phoneHomeCountryId").val();
var phoneHomeCityId = $("#phoneHomeCityId").val();
var phoneHome = $("#phoneHome").val();
var phoneCellCountryId = $("#phoneCellCountryId").val();
var phoneCellCityId = $("#phoneCellCityId").val();
var phoneCell = $("#phoneCell").val();
var userCpf = $("#userCpf").val();
var userBirth = $("#userBirth").val();
var userAddressCountry = $("#userAddressCountry").val();
var userAddressState = $("#userAddressState").val();
var userAddressCity = $("#userAddressCity").val();
var userAddressStreet = $("#userAddressStreet").val();
var userAddressNumber = $("#userAddressNumber").val();
var userAddressCompl = $("#userAddressCompl").val();
var userAddressDistrict = $("#userAddressDistrict").val();
$.post('./cadastro/processa/identificacao', {trueName:trueName, trueSurname:trueSurname, phoneHome:phoneHome, phoneHomeCountryId:phoneHomeCountryId, phoneHomeCityId:phoneHomeCityId, phoneCell:phoneCell,phoneCellCountryId:phoneCellCountryId, phoneCellCityId:phoneCellCityId, userCpf:userCpf, userBirth:userBirth, userAddressCountry:userAddressCountry, userAddressState:userAddressState, userAddressCity:userAddressCity, userAddressStreet:userAddressStreet, userAddressNumber:userAddressNumber, userAddressCompl:userAddressCompl, userAddressDistrict:userAddressDistrict, },
function(resposta) {
$("#ErrorBarContent1").hide();
$("#ErrorBarContent2").hide();
$("#ErrorBarContent3").hide();
$("input[type=submit]").removeAttr("disabled");
if (resposta != false) {
if(resposta == "11"){
$("#ErrorBarContent1").show();
}
if(resposta == "12"){
$("#ErrorBarContent2").show();
}
if(resposta == "1"){
$("#ErrorBarContent3").show();
}
} else {
location.href ="cadastro/caracteristicas-gerais/";
}
});
return false;
});
});
}
</script>
这是HTML
<form id="formIDRegister" class="" method="post" action="javascript:func()" accept-charset="UTF-8">
<div id="ErrorBarContent1" onclick="$(this).fadeOut('slow');" style="display:none;"><div class="yellowErrorBar">Todos os campos devem ser preenchidos</div></div>
<div id="ErrorBarContent2" onclick="$(this).fadeOut('slow');" style="display:none;"><div class="yellowErrorBar">Cpf já está sendo utilizado por outro usuário.</div></div>
<div id="ErrorBarContent3" onclick="$(this).fadeOut('slow');" style="display:none;"><div class="redErrorBar">Opps, ocorreu um erro ao atualizar seu cadastro, nossa equipe já foi avisada. Por favor, tente novamente mais tarde.</div></div>
<!-- name -->
<div class="rowOff" id="name">
<p><i>1.</i> Identificação</p>
<label>
<span class="trueName">Seu(s) nome(s)</span><br />
<input value="" class="validate[required] text-input" type="text" name="trueName" id="trueName" />
</label>
<label>
<span class="trueSurname">e seu(s) sobrenome(s)</span><br />
<input value="" class="validate[required] text-input" type="text" name="trueSurname" id="trueSurname" />
</label>
</div>
<!-- phone -->
<div class="rowOn" id="phone">
<p><i>2.</i> Telefones para contato</p>
<div class="phone1">
<span class="phoneHome">Telefone de contato 1</span><br />
<input onmouseover="tooltip.show('Insira o código de seu país');" onmouseout="tooltip.hide();" value="" class="validate[required,custom[onlyNumberSp]] text-input" type="text" name="phoneHomeCountryId" id="phoneHomeCountryId" maxlength="3" />
<input onmouseover="tooltip.show('Insira o código de área');" onmouseout="tooltip.hide();" value="" class="validate[required,custom[onlyNumberSp]] text-input" type="text" name="phoneHomeCityId" id="phoneHomeCityId" maxlength="2" />
<input value="" class="validate[required,custom[onlyNumberSp]] text-input" type="text" name="phoneHome" id="phoneHome" />
</div>
<br />
<br />
<br />
<div class="phone2">
<span class="phoneCell">Telefone de contato 2</span><br />
<input onmouseover="tooltip.show('Insira o código de seu país');" onmouseout="tooltip.hide();" value="" class="validate[required,custom[onlyNumberSp]] text-input" type="text" name="phoneCellCountryId" id="phoneCellCountryId" maxlength="3" />
<input onmouseover="tooltip.show('Insira o código de área');" onmouseout="tooltip.hide();" value="" class="validate[required,custom[onlyNumberSp]] text-input" type="text" name="phoneCellCityId" id="phoneCellCityId" maxlength="2" />
<input value="" class="validate[required,custom[onlyNumberSp]] text-input" type="text" name="phoneCell" id="phoneCell" />
</div>
<div id="divPhoneInfo">Seu número de telefone não será divulgado. Garantimos o sigilo.</div>
</div>
<!-- cpf -->
<div class="rowOff" id="cpf">
<p><i>3.</i> CPF</p>
<label>
<span class="userCpf">Insira seu CPF </span><br />
<input value="" class="validate[required] text-input" type="text" name="userCpf" id="userCpf" /> <span class="hotspot" onmouseover="tooltip.show('Insira o número de seu CPF de 11 dígitos');" onmouseout="tooltip.hide();"><img src="./images/userInterface/info.png" /></span>
</label>
<div id="divCpfInfo">Insira um número de CPF válido. O uso de números falsos implica no descumprimento dos <a href="">Termos de Utilização</a>, e estará sujeito às penas da Lei.</div>
</div>
<!-- birth -->
<div class="rowOn" id="birth">
<p><i>4.</i> Data de nascimento</p>
<label>
<span class="userBirth">Insira sua data de nascimento </span><br />
<input value="" class="validate[required] text-input" type="text" name="userBirth" id="userBirth" /> <span class="hotspot" onmouseover="tooltip.show('Você PRECISA ser maior de 18 anos para se cadastrar! O formato é dd/mm/aaaa');" onmouseout="tooltip.hide();"><img src="./images/userInterface/info.png" /></span>
</label>
</div>
<!-- address -->
<div class="rowOff" id="adress">
<p><i>5.</i> Endereço</p>
<label id="pais">
<span class="userAddressCountry">País</span><br />
<select name="userAddressCountry" id="userAddressCountry" class="validate[required]" onchange="buscaEstados(this.value)" /></select>
</label >
<label id="estado" style="display: none">
<span class="userAddressState">Estado</span><br />
<select value="" class="validate[required] text-input" type="text" name="userAddressState" id="userAddressState" onchange="buscaCidades(this.value)"/><option value="">Primeiramente, selecione o pais</option></select>
</label>
<label id="cidade" style="display: none">
<span class="userAddressCity">Cidade</span><br />
<select value="" class="validate[required] text-input" type="text" name="userAddressCity" id="userAddressCity" readonly="readonly" /><option value="">Primeiramente, selecione o pais</option></select>
</label>
<br />
<br />
<br />
<div id="endereco" style="display: none">
<label>
<span class="userAddressStreet">Escreva seu Endereço</span><br />
<input value="" class="validate[required] text-input" type="text" name="userAddressStreet" id="userAddressStreet" />
</label>
<label>
<span class="userAddressNumber">Número</span><br />
<input value="" class="validate[required] text-input" type="text" name="userAddressNumber" id="userAddressNumber" />
</label>
<label>
<span class="userAddressCompl">Complemento</span><br />
<input value="" class="" type="text" name="userAddressCompl" id="userAddressCompl" />
</label>
<label>
<span class="userAddressDistrict">Bairro</span><br />
<input value="" class="validate[required] text-input" type="text" name="userAddressDistrict" id="userAddressDistrict" />
</label>
</div>
</div>
<div id="divAddressInfo">Assim como os números de contato e o CPF, seu endereço estará sob total sigilo. Em seu perfil aparecerão apenas <b>País</b>, <b>Estado</b> e <b>Cidade</b></div>
<!-- submit -->
<div class="rowOn" style="margin-top: 40px; padding-top: 40px;">
<label style="margin-left: 170px;">
<input class="submit" type="submit" value="Enviar e Prosseguir" id="sendButtonRegister" />
</label>
</div>
<!-- /formID4 -->
</form>
当我点击提交时,在第一次点击时,没有任何反应(实际上,屏幕的位置会进入中间)。表单仅在第二次单击时提交。有什么问题?
答案 0 :(得分:0)
你不应该使用$(document).ready(function()到函数func()
最重要的是使用下一个代码
$('#formIDRegister').submit(function(e){
e.preventDefault();
func();//your function
});
此代码可以放入$(document).ready函数或表单之后 同时从表单标记
中删除action =“javascript:func()”属性