$(function(){
$("#submit").click(function(){
var first_name = $("#first_name").val();
var last_name = $("#last_name").val();
var phone = $("#phone").val();
var email = $("#email").val();
var ans = true;
var atpos = email.indexOf("@");
var dotpos = email.lastIndexOf(".");
if(first_name === ""){
window.alert("?? ????? ??? ????????? ?????");
$("#first_name").addClass("WrongInp");
ans = false;
}else{
$("#first_name").removeClass("WrongInp");
}
if(last_name === ""){
window.alert("?? ????? ??? ??????? ??????? ?????");
$("#last_name").addClass("WrongInp");
ans = false;
}else{
$("#last_name").removeClass("WrongInp");
}
if(phone.value === ""){
window.alert("?? ????? ??? ?????????? ?????");
$("#phone").addClass("WrongInp");
ans = false;
}else{
$("#phone").removeClass("WrongInp");
}
if(phone.length < 9 || phone.length > 14){
window.alert("???? ??? ???? ????");
$("#phone").addClass("WrongInp");
ans = false;
}else{
$("#phone").removeClass("WrongInp");
}
if (email === '') {
alert('?????? ????? ?????? ??????????');
return false;
}
if (atpos < 1 || dotpos < atpos 2 || dotpos 2 >= email.length) {
alert("?????? ?????????? ??? ????");
return false;
}
if(ans === true){
var url = 'Cant Reveal';
var form = new FormData();
form.append("first_name", $('#first_name').val());
form.append("last_name", $('#last_name').val());
form.append("phone", $('#phone').val());
form.append("email", $('#email').val());
form.append("status", "new");
var settings = {
"url": "cant Reveal",
"method": "POST",
"timeout": 0,
"headers": {
"Authorization": "Cant Reveal"
},
"processData": false,
"mimeType": "multipart/form-data",
"contentType": false,
"data": form
};
$.ajax(settings).done(function (response) {
window.location.href = "www.google.com";
});
}
return false;
});
});<form id="myForm">
<input name="first_name" id="first_name" class="input" type="text" placeholder="????? ??????" required />
<input name="phone" id="phone" minlength="8" maxlength="15" class="input" type="text" placeholder="??????" required />
<input name="email" id="email" pattern="[a-zA-Z0-9._% -] @[a-zA-Z0-9.-] \.[a-zA-Z]{2,}" class="input" type="text" placeholder="?????? ??????????" required />
<button type="text" class="submit">submit</button>
<input type="hidden" name="last_name" id="last_name" value="LN">
</form>我想我在 javascript 中進行了更改，首先我驗證表單，然后使用 ans ans 提交它必須為真，如果其中一個欄位為空或電話和電子郵件與我的驗證不匹配，如果變為 false 并且不繼續
在javascript部分提出任何建議，或者我可以洗掉這一部分并寫另一個更好的......
uj5u.com熱心網友回復：
該click處理器不作業，因為你把它系結到id為HTML元素submit- $("#submit")。
在提供的 HTML 中，您使用的是 class submit，而不是 id。
<button type="text" class="submit">submit</button>
要使處理程式作業，請更改此行：
$("#submit").click(function(){
對這個
$(".submit").click(function(){
另一種選擇是在 HTML 中使用 id 而不是 class
<button type="text" id="submit">submit</button>
在javascript部分提出任何建議，或者我可以洗掉這一部分并寫另一個更好的......
如果您是初學者，這樣擁有它是完全可以的。如果你想讓它更干凈一點（因為你使用的是 jQuery），我建議你看看像 - jquery-validation這樣的插件
uj5u.com熱心網友回復：
試試這個。
$(document).ready(function(){
$("#submit").click(function(){
var first_name = $("#first_name").val();
var last_name = $("#last_name").val();
var phone = $("#phone").val();
var email = $("#email").val();
var ans = true;
var atpos = email.indexOf("@");
var dotpos = email.lastIndexOf(".");
if(first_name === ""){
window.alert("?? ????? ??? ????????? ?????");
$("#first_name").addClass("WrongInp");
ans = false;
}else{
$("#first_name").removeClass("WrongInp");
}
if(last_name === ""){
window.alert("?? ????? ??? ??????? ??????? ?????");
$("#last_name").addClass("WrongInp");
ans = false;
}else{
$("#last_name").removeClass("WrongInp");
}
if(phone.value === ""){
window.alert("?? ????? ??? ?????????? ?????");
$("#phone").addClass("WrongInp");
ans = false;
}else{
$("#phone").removeClass("WrongInp");
}
if(phone.length < 9 || phone.length > 14){
window.alert("???? ??? ???? ????");
$("#phone").addClass("WrongInp");
ans = false;
}else{
$("#phone").removeClass("WrongInp");
}
if (email === '') {
alert('?????? ????? ?????? ??????????');
return false;
}
if (atpos < 1 || dotpos < atpos 2 || dotpos 2 >= email.length) {
alert("?????? ?????????? ??? ????");
return false;
}
if(ans === true){
var url = 'Cant Reveal';
var form = new FormData();
form.append("first_name", $('#first_name').val());
form.append("last_name", $('#last_name').val());
form.append("phone", $('#phone').val());
form.append("email", $('#email').val());
form.append("status", "new");
var settings = {
"url": "cant Reveal",
"method": "POST",
"timeout": 0,
"headers": {
"Authorization": "Cant Reveal"
},
"processData": false,
"mimeType": "multipart/form-data",
"contentType": false,
"data": form
};
$.ajax(settings).done(function (response) {
window.location.href = "www.google.com";
});
}
return false;
});
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form id="myForm">
<input name="first_name" id="first_name" class="input" type="text" placeholder="????? ??????" required />
<input name="phone" id="phone" minlength="8" maxlength="15" class="input" type="text" placeholder="??????" required />
<input name="email" id="email" pattern="[a-zA-Z0-9._% -] @[a-zA-Z0-9.-] \.[a-zA-Z]{2,}" class="input" type="text" placeholder="?????? ??????????" required />
<button type="text" class="submit">submit</button>
<input type="hidden" name="last_name" id="last_name" value="LN">
</form>轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/311219.html
標籤：javascript html 查询 形式
下一篇：Django更新用戶表單