Formani tekshirish javascript/html yordamida ishlamaydi

Men butun kunim kodimni sinab ko'rdim, lekin hech narsa sodir bo'lmaydi. Shakl avtomatik ravishda success.html faylini ochadi va skriptdan foydalanmaydi.

<div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false"> <div class="snippet-code">

        function FormValidation(theForm) {
            var errors = "";
            var alph = /^[\w ]+$/;
            var cardnumb = /^\d{16}$/;
            var cvvnumb = /^\d{3}$/;
            var monthnumb = /^\d{1,2}$/;
            var yearnumb = /^\d{4}$/;

            if (form.one.value == "") {
                errors += "Please enter your full name! \n";
                }

            else if (!alph.test(form.one.value)) {
                errors += "Full name is wrong or includes invalid characters! \n";
            }
            if (form.two.value == "") {
                errors += "Please enter your 16-digit code! \n";
            }

            if (!cardnumb.test(form.two.value)) {
                errors += "Card number does not consist of 16 digits or includes invalid characters! \n";
            }

            if (form.three.value == "") {
                errors += "Please enter your month of expiration! \n";
            }

            if (!monthnumb.test(form.three.value)) {
                errors += "The month does not consist of 2 digits or includes invalid characters! \n";
            }
                    
            if (form.four.value == "") {
                errors += "Please enter your year of expiration! \n";
            }

            if (!yearnumb.test(form.four.value)) {
                errors += "The year does not consist of 4 digits or includes invalid characters! \n";
            }

            if (form.five.value == "") {
                errors += "Please enter your 3-digit CVV code! \n";
            }

            if (!cvvnumb.test(form.five.value)) {
                errors += "The CVV does not consist of 3 digits or includes invalid characters! \n";
            }
                    
            if (!content == "") {
                alert(content);
                return false;
                }
        }
 <!DOCTYPE HTML>
    
    
<link rel="stylesheet" type="text/css" href="style.css"> <meta name="description" content="NRN"> <meta name="author" content="NRN"> 
NRN</title> </head> <body class="Body" id="Main">
        
Payment form validation using JavaScript
<form method="POST" action="success.html" class="myForm" name="myForm" onSubmit="javascript:return FormValidation(this)"> <div class="form-group-name">
<input type="text" placeholder="Name on card" class="form-control-1" id="one" name="one"> </div> <div class="form-group-number">
<input type="text" placeholder="16-digit code" class="form-control-2" id="two" name="two"> </div> <div class="form-group-date">
<input type="text" placeholder="Month" class="form-control-3" id="three" name="three"> <input type="text" placeholder="Year" class="form-control-3" id="four" name="four"> </div> <div class="form-group-cvv">
<input type="text" placeholder="3-digit code" class="form-control-4" id="five" name="five"> </div> <div class="form-group-submit"> <input type="submit" class="submit_form" value="Validate"> </div> </form> </body> </html>
</div> </div>

Men hamma narsalarni, shuningdek, ko'plab darslarni ham nazorat qildim, ammo bu yordam bermaydi. Iltimos yordam bering! Oldindan rahmat! Muammo .css faylida bo'lishi mumkinmi?

0
Ushbu xatoni konsolda ko'rib chiqayapman: "formulani" ramka "sandboxed" va "ruxsat beruvchi formalar" ruxsati o'rnatilmaganligi sababli "success.html" ga bloklangan ariza yuborish.
qo'shib qo'ydi muallif Monicka, manba
Konsolda ikkinchi xato: '' ariza formasining ramkaga aylanganligi va 'ruxsat beruvchi formalar' ruxsati o'rnatilmaganligi uchun bloklangan ariza yuborish.
qo'shib qo'ydi muallif Monicka, manba

8 javoblar

mazmuni hech qachon "" ga teng kelmaganligi uchun tarkibi hech joyda o'rnatilmaganligi sababli JavaScript-ni tekshirish funktsiyasi noTo'g'ri ko'rsatilmaydi, shuning uchun ariza xaToga yo'l qo'ygan bo'lsa ham yuborishni davom ettiradi.

Boshlash uchun siz o'zgartirishingiz kerak

if (!content == "") {
    alert(content);
    return false;
}

To

if (!errors == "") {
    alert(errors);
    return false;
} else {
    return true;
}

Agar sizning JavaScript-ni funktsiyasi true qaytarilsa, ariza topshirishda davom etadi. Agar FALSE kodi qaytarilsa, xatolik yuz berganda, ariza yuborish to'xtatiladi.

Bundan tashqari, quyidagi tarzda onSubmit xususiyati formasi elementida funktsiyani o'rnatishingiz mumkin:

<form onSubmit="return FormValidation(this)""></form>

Tulio Faria ta'kidlaganidek

1
qo'shib qo'ydi

mazmuni hech qachon "" ga teng kelmaganligi uchun tarkibi hech joyda o'rnatilmaganligi sababli JavaScript-ni tekshirish funktsiyasi noTo'g'ri ko'rsatilmaydi, shuning uchun ariza xaToga yo'l qo'ygan bo'lsa ham yuborishni davom ettiradi.

Boshlash uchun siz o'zgartirishingiz kerak

if (!content == "") {
    alert(content);
    return false;
}

To

if (!errors == "") {
    alert(errors);
    return false;
} else {
    return true;
}

Agar sizning JavaScript-ni funktsiyasi true qaytarilsa, ariza topshirishda davom etadi. Agar FALSE kodi qaytarilsa, xatolik yuz berganda, ariza yuborish to'xtatiladi.

Bundan tashqari, quyidagi tarzda onSubmit xususiyati formasi elementida funktsiyani o'rnatishingiz mumkin:

<form onSubmit="return FormValidation(this)""></form>

Tulio Faria ta'kidlaganidek

1
qo'shib qo'ydi

aslidaSubmit-da Javascript funktsiyasini kutmoqda. Shunday qilib, buni amalga oshirishingiz mumkin (javascriptni o'chirish: onSubmit'dan):

<form method="POST" action="success.html" class="myForm" name="myForm" onSubmit="return FormValidation(this)">

0
qo'shib qo'ydi
Bu yechim muammoini hal qiladimi?
qo'shib qo'ydi muallif Monicka, manba

aslidaSubmit-da Javascript funktsiyasini kutmoqda. Shunday qilib, buni amalga oshirishingiz mumkin (javascriptni o'chirish: onSubmit'dan):

<form method="POST" action="success.html" class="myForm" name="myForm" onSubmit="return FormValidation(this)">

0
qo'shib qo'ydi
Bu yechim muammoini hal qiladimi?
qo'shib qo'ydi muallif Monicka, manba

"Form" ni o'zgartiring, sizda "theFrom" funksiyasi mavjud

disk raskadrovka va bu formada aniqlanmaganligini topishingiz mumkin

if (form.one.value == "") {
    errors += "Please enter your full name! \n";
}

FormValidation funktsiyasida "form" bilan o'zgartirilsin

if (theForm.one.value == "") {
    errors += "Please enter your full name! \n";
}

bu erda kontent yana aniqlanmagan

 if (!content == "") {
     alert(content);
     return false;
 }

Buning o'rniga xato bo'lishi kerak

if (!errors == "") {
    alert(errors);
    return false;
} else {
    return true;
}

Mana sizga ish kodingiz

<!DOCTYPE HTML>

<meta name="description" content="NRN"> <meta name="author" content="NRN"> 
NRN</title> <script type="text/javascript"> function FormValidation(theForm) { var errors = ""; var alph = /^[\w ]+$/; var cardnumb = /^\d{16}$/; var cvvnumb = /^\d{3}$/; var monthnumb = /^\d{1,2}$/; var yearnumb = /^\d{4}$/; if (theForm.one.value == "") { errors += "Please enter your full name! \n"; } else if (!alph.test(theForm.one.value)) { errors += "Full name is wrong or includes invalid characters! \n"; } if (theForm.two.value == "") { errors += "Please enter your 16-digit code! \n"; } if (!cardnumb.test(theForm.two.value)) { errors += "Card number does not consist of 16 digits or includes invalid characters! \n"; } if (theForm.three.value == "") { errors += "Please enter your month of expiration! \n"; } if (!monthnumb.test(theForm.three.value)) { errors += "The month does not consist of 2 digits or includes invalid characters! \n"; } if (theForm.four.value == "") { errors += "Please enter your year of expiration! \n"; } if (!yearnumb.test(theForm.four.value)) { errors += "The year does not consist of 4 digits or includes invalid characters! \n"; } if (theForm.five.value == "") { errors += "Please enter your 3-digit CVV code! \n"; } if (!cvvnumb.test(theForm.five.value)) { errors += "The CVV does not consist of 3 digits or includes invalid characters! \n"; } if (!errors == "") { alert(errors); return false; } else { return true; } } </script> </head> <body class="Body" id="Main">

Payment form validation using JavaScript
<form method="POST" action="success.html" class="myForm" name="myForm" onSubmit="javascript:return FormValidation(this)"> <div class="form-group-name">
<input type="text" placeholder="Name on card" class="form-control-1" id="one" name="one"> </div> <div class="form-group-number">
<input type="text" placeholder="16-digit code" class="form-control-2" id="two" name="two"> </div> <div class="form-group-date">
<input type="text" placeholder="Month" class="form-control-3" id="three" name="three"> <input type="text" placeholder="Year" class="form-control-3" id="four" name="four"> </div> <div class="form-group-cvv">
<input type="text" placeholder="3-digit code" class="form-control-4" id="five" name="five"> </div> <div class="form-group-submit"> <input type="submit" class="submit_form" value="Validate"> </div> </form> </body> </html>
0
qo'shib qo'ydi

"Form" ni o'zgartiring, sizda "theFrom" funksiyasi mavjud

disk raskadrovka va bu formada aniqlanmaganligini topishingiz mumkin

if (form.one.value == "") {
    errors += "Please enter your full name! \n";
}

FormValidation funktsiyasida "form" bilan o'zgartirilsin

if (theForm.one.value == "") {
    errors += "Please enter your full name! \n";
}

bu erda kontent yana aniqlanmagan

 if (!content == "") {
     alert(content);
     return false;
 }

Buning o'rniga xato bo'lishi kerak

if (!errors == "") {
    alert(errors);
    return false;
} else {
    return true;
}

Mana sizga ish kodingiz

<!DOCTYPE HTML>

<meta name="description" content="NRN"> <meta name="author" content="NRN"> 
NRN</title> <script type="text/javascript"> function FormValidation(theForm) { var errors = ""; var alph = /^[\w ]+$/; var cardnumb = /^\d{16}$/; var cvvnumb = /^\d{3}$/; var monthnumb = /^\d{1,2}$/; var yearnumb = /^\d{4}$/; if (theForm.one.value == "") { errors += "Please enter your full name! \n"; } else if (!alph.test(theForm.one.value)) { errors += "Full name is wrong or includes invalid characters! \n"; } if (theForm.two.value == "") { errors += "Please enter your 16-digit code! \n"; } if (!cardnumb.test(theForm.two.value)) { errors += "Card number does not consist of 16 digits or includes invalid characters! \n"; } if (theForm.three.value == "") { errors += "Please enter your month of expiration! \n"; } if (!monthnumb.test(theForm.three.value)) { errors += "The month does not consist of 2 digits or includes invalid characters! \n"; } if (theForm.four.value == "") { errors += "Please enter your year of expiration! \n"; } if (!yearnumb.test(theForm.four.value)) { errors += "The year does not consist of 4 digits or includes invalid characters! \n"; } if (theForm.five.value == "") { errors += "Please enter your 3-digit CVV code! \n"; } if (!cvvnumb.test(theForm.five.value)) { errors += "The CVV does not consist of 3 digits or includes invalid characters! \n"; } if (!errors == "") { alert(errors); return false; } else { return true; } } </script> </head> <body class="Body" id="Main">

Payment form validation using JavaScript
<form method="POST" action="success.html" class="myForm" name="myForm" onSubmit="javascript:return FormValidation(this)"> <div class="form-group-name">
<input type="text" placeholder="Name on card" class="form-control-1" id="one" name="one"> </div> <div class="form-group-number">
<input type="text" placeholder="16-digit code" class="form-control-2" id="two" name="two"> </div> <div class="form-group-date">
<input type="text" placeholder="Month" class="form-control-3" id="three" name="three"> <input type="text" placeholder="Year" class="form-control-3" id="four" name="four"> </div> <div class="form-group-cvv">
<input type="text" placeholder="3-digit code" class="form-control-4" id="five" name="five"> </div> <div class="form-group-submit"> <input type="submit" class="submit_form" value="Validate"> </div> </form> </body> </html>
0
qo'shib qo'ydi

Muammo shundaki, siz taqdimot tadbirini boshqarishingiz kerak, shuning uchun funktsiyangiz qo'shimcha parametrga (hodisa) kerak va uning ichida birinchi funktsiya (funktsiya) event.preventDefault() bo'lishi kerak, shuning uchun uni yuborishdan oldin ariza topshirganingizda funktsiyangiz amalga oshiriladi va keyin sizning kodingizning oxirida tekshiruv tugallangach, arizangizni JS yordamida yuboring bu erda . Sizda bir narsa bor

function formValidation(theForm, event)
{
    event.preventDefault()
    //your code

    if(allOk)
   {           theForm.submit()
}
    else
{
   //do something
}


}

HTML tomonida sizga ega bo'lasiz

<form method="POST" action="success.html" class="myForm" name="myForm" onSubmit="return FormValidation(this, event)">
0
qo'shib qo'ydi

Muammo shundaki, siz taqdimot tadbirini boshqarishingiz kerak, shuning uchun funktsiyangiz qo'shimcha parametrga (hodisa) kerak va uning ichida birinchi funktsiya (funktsiya) event.preventDefault() bo'lishi kerak, shuning uchun uni yuborishdan oldin ariza topshirganingizda funktsiyangiz amalga oshiriladi va keyin sizning kodingizning oxirida tekshiruv tugallangach, arizangizni JS yordamida yuboring bu erda . Sizda bir narsa bor

function formValidation(theForm, event)
{
    event.preventDefault()
    //your code

    if(allOk)
   {           theForm.submit()
}
    else
{
   //do something
}


}

HTML tomonida sizga ega bo'lasiz

<form method="POST" action="success.html" class="myForm" name="myForm" onSubmit="return FormValidation(this, event)">
0
qo'shib qo'ydi
Javascript UZB
Javascript UZB
99 ishtirokchilar

@js_uzb @vuejs_uz @react_uz @nodejs_uz @angular_uz @ngTashkent @yiiframework_uz @laravel_uz @linux_uzbek @python_uz @swift_uzb —————— @uzdevgroup @UzGeeksGroup ——— @UzDev_Jobs @jobs_uzb