ฉันจะเลือกฟอร์มหลักตามปุ่มส่งได้อย่างไร?

ฉันมีหน้าเว็บที่มี 3 รูปแบบอยู่ ไม่ซ้อนกันเพียงตัวเดียว (เกือบจะเหมือนกันมีเพียงตัวแปรซ่อนเดียวที่แตกต่างกัน) ผู้ใช้จะกรอกแบบฟอร์มเดียวเท่านั้นและฉันต้องการตรวจสอบความถูกต้อง / etc ทุกรูปแบบด้วยสคริปต์ JS เพียงชุดเดียว

ดังนั้นเมื่อผู้ใช้คลิกปุ่มส่งของฟอร์ม # 1 ฉันจะทำให้สคริปต์ js ของฉันจัดการเฉพาะกับฟิลด์ใน form1 ได้อย่างไร ฉันรวบรวมมันมีบางอย่างเกี่ยวกับ $ (this) .parents แต่ฉันไม่แน่ใจว่าจะทำอย่างไรกับมัน

สคริปต์ตรวจสอบความถูกต้องของฉัน (ซึ่งฉันใช้ที่อื่นโดยมีเพียงรูปแบบเดียว) มีลักษณะดังนี้:

$(document).ready(function(){
    $("#submit").click(function(){
        $(".error").hide();
        var hasError = false;

        var nameVal = $("#name").val();
        if(nameVal == '') {
            $("#name").after('Please enter your name.');
            hasError = true;
        }


        if(hasError == false) {blah blah do all the processing stuff}

ดังนั้นฉันต้องแทนที่สิ่งต่างๆเช่น $ ("# name"). val () ด้วย $ (this) .parents ('form'). name.val ()? หรือมีวิธีที่ดีกว่านี้หรือไม่?

ขอบคุณ!

คุณสามารถเลือกแบบฟอร์มดังนี้:

$("#submit").click(function(){
    var form = $(this).parents('form:first');
    ...
});

อย่างไรก็ตามโดยทั่วไปแล้วจะเป็นการดีกว่าที่จะแนบเหตุการณ์เข้ากับเหตุการณ์ส่งของแบบฟอร์มเองเนื่องจากจะทริกเกอร์แม้ว่าจะส่งโดยการกดปุ่ม Enter จากฟิลด์ใดฟิลด์หนึ่ง:

$('form#myform1').submit(function(e){
     e.preventDefault(); //Prevent the normal submission action
     var form = this;
     // ... Handle form submission
});

ในการเลือกเขตข้อมูลภายในฟอร์มให้ใช้บริบทของฟอร์ม ตัวอย่างเช่น:

$("input[name='somename']",form).val();

ฉันพบคำตอบนี้เมื่อค้นหาวิธีค้นหารูปแบบขององค์ประกอบอินพุต ฉันต้องการเพิ่มบันทึกเพราะตอนนี้มีวิธีที่ดีกว่าการใช้:

var form = $(this).parents('form:first');

ฉันไม่แน่ใจว่าเมื่อไหร่ที่มันถูกเพิ่มลงใน jQuery แต่วิธีการที่ใกล้เคียงที่สุด () จะตอบสนองสิ่งที่ต้องการได้มากกว่าการใช้ผู้ปกครอง () ด้วยรหัสที่ใกล้เคียงที่สุดสามารถเปลี่ยนเป็นสิ่งนี้:

var form = $(this).closest('form');

มันเคลื่อนผ่านขึ้นไปและพบองค์ประกอบแรกที่ตรงกับสิ่งที่คุณกำลังมองหาและหยุดอยู่ที่นั่นดังนั้นจึงไม่จำเป็นต้องระบุ: ก่อน

หากต้องการรับแบบฟอร์มที่ส่งอยู่ภายในทำไมไม่เพียง

this.form

เส้นทางสู่ผลลัพธ์ที่ง่ายและรวดเร็วที่สุด

ฉันใช้วิธีการต่อไปนี้และใช้ได้ผลดีสำหรับฉัน

$('#mybutton').click(function(){
        clearForm($('#mybutton').closest("form"));
    });

$('#mybutton').closest("form") ทำเคล็ดลับให้ฉัน

Eileen: ไม่มันไม่ใช่ var nameVal = form.inputname.val();ไม่มีก็ไม่ได้ ควรเป็นอย่างใดอย่างหนึ่ง ...

ใน jQuery:

// you can use IDs (easier)

var nameVal =  $(form).find('#id').val();

// or use the [name=Fieldname] to search for the field

var nameVal =  $(form).find('[name=Fieldname]').val();

หรือใน JavaScript:

var nameVal = this.form.FieldName.value;

หรือการรวมกัน:

var nameVal = $(this.form.FieldName).val();

ด้วย jQuery คุณสามารถวนซ้ำอินพุตทั้งหมดในรูปแบบ:

$(form).find('input, select, textarea').each(function(){

  var name = this.name;
  // OR
  var name = $(this).attr('name');

  var value = this.value;
  // OR
  var value = $(this).val();
  ....
  });