Как сделать список всех полей ввода в форме с функцией $ () в jquery?

Question

Моя HTML-форма выглядит примерно так:

<form id="form1" name="form1" method="post" action="">
number: <input name="formnum" type="text" id="input_1" tabindex="1" size="30" maxlength="30" />
Title:
<select name="title" id="input_2" tabindex="2" >
   <option selected="selected" value=""></option>
   <option  value="Mr." id="option_1 ">Mr.</option>
   <option  value="Mrs." id="option_2">Mrs.</option>
   <option  value="Ms." id="option_3">Ms.</option>
   <option  value="Dr." id="option_4">Dr.</option>
</select>
<label> <input type="radio" name="gender" value="Male" id="input_3" tabindex="3"/>Male </label>
<label> <input type="radio" name="gender" value="Female" id="input_3"/> Female</label>
First Name:
<input name="fname" type="text" id="input_5" tabindex="4" value="" size="30" maxlength="30"  />
Last Name:
<input name="lname" type="text" id="input_6" tabindex="5" value="" size="30" maxlength="30"  /> 
Address:
<input name="address" type="text" id="input_7" tabindex="6" value="" size="30" maxlength="30"  />
<input type="submit" name="Submit" value="Submit" tabindex="16" />
<input type="reset" name="Submit2" value="Reset" tabindex="17" />
</form>

Я хочу составить список всех элементов ввода в форме в той последовательности, в которой они отображаются в браузере на $(document).ready(). Я написал следующее заявление в jQuery, чтобы перечислить элементы input в форме в той последовательности, в которой они отображаются в браузере:

var textboxes = $("#form1 :input")

1. Но это утверждение дает только список элементов, имеющих тег input, т.е. все текстовые поля, переключатели и кнопки отправки.
2. Он не включал поле выбора, текстовую область в данный список.

Это мой код jQuery:

$(document).ready(function(){

var textboxes = $("#form1 :input"), //gets all the textboxes         
        images = $("img.classforimg");   //gets all the images
    images.hide(); //hide all of them except the first one
alert(textboxes.length);
    textboxes.each(function (i){
                var j = i;
                    $(this).focus(function (){
                images.hide(); //hide all of them except the first one
                                images.eq(0).show();
                images.eq(j).show();
                });
            });

**Here Jquery code for form validation**
**Here Jquery code of Custom validation methods**
});

Вопросы:

1. Как получить список всех элементов в форме в той последовательности, в которой они отображаются в браузере на $(document).ready(), включая все текстовые поля ввода, группы переключателей, флажки, поля выбора, текстовые области и кнопки?
2. Вышеприведенное утверждение рассматривает переключатели в приведенной выше форме как отдельные переключатели и не рассматривает их как группу, но на самом деле вышеуказанные переключатели относятся к той же группе. Так как же решить эти проблемы?

Пожалуйста, помогите мне, друзья! Спасибо!

Answer 1

 $('#form1 input,#form1 select,#form1 textarea')

или

$('#form1').find('select,input,textarea')

---

Обновлено для ответа 2:

$('#form1').find('select,input[type!=radio],textarea,input[type=radio]:checked')

Вы можете найти выбранный радиовход с помощью input[type=radio]:checked, однако, если в группе не выбран ни один параметр радиосвязи, вы не получите никаких опций. JQuery должен проанализировать это в том же порядке, в котором они находятся в DOM

Answer 2

var data = $('#form1').serialize();

затем сделайте некоторое регулярное выражение, чтобы получить ключи из строки: -)

Answer 3

Если вы хотите фактический порядок, в котором они появляются, попробуйте это:

$("#form1").find("*").filter(function() {
    return !jQuery.inArray(this.tagName.toUpperCase(), ["INPUT","SELECT","TEXTAREA"]);
})