Як отримати тип введення за допомогою jquery?

У мене є сторінка, де тип вводу завжди змінюється, і мені потрібно отримати значення залежно від типу введення. Отже, якщо тип - це радіо, мені потрібно отримати те, що його встановлено, і якщо це прапорець, мені потрібно зараз перевірити, і якщо це спад, я повинен знати, що вибрано, і я, якщо це текст / textarea Мені потрібно знати значення.

Будь-яка ідея, як це зробити?

EDIT 1 лютого 2013. Через популярність цієї відповіді та зміни в jQuery у версії 1.9 (та 2.0) щодо властивостей та атрибутів, я додав деякі примітки та загадку, щоб побачити, як це працює під час доступу до властивостей / атрибутів на вході, кнопки та деякі вибирає. Загадка тут: http://jsfiddle.net/pVBU8/1/

отримати всі входи:

var allInputs = $(":input");

отримати всі типи входів:

allInputs.attr('type');

отримати значення:

allInputs.val();

ПРИМІТКА: .val () НЕ те саме, що: перевіряється для тих типів, де це відповідає. використання:

.attr("checked");

EDIT 1 лютого 2013 р. - re: jQuery 1.9 використовувати prop () not attr (), оскільки attr не поверне належні значення для властивостей, які змінилися.

.prop('checked');

або просто

$(this).checked;

щоб отримати значення чека - що б воно не було зараз. або просто скористайтеся пунктом ": перевірено", якщо ви хочете лише те, що ARE перевірено.

EDIT: Ось ще один спосіб ввести тип:

var allCheckboxes=$('[type=checkbox]');

EDIT2: Зауважте, що форма:

$('input:radio');

надається перевагу

$(':radio');

які обидва прирівнюються до:

$('input[type=radio]');

але "вхід" бажаний, тому він отримує лише вхідні дані і не використовує універсальний "*", коли використовується форма $(':radio'), яка дорівнює$('*:radio');

EDIT 19 серпня 2015: перевагу $('input[type=radio]');слід використовувати, оскільки це дозволяє сучасним браузерам оптимізувати пошук радіовведення.

EDIT 1 лютого 2013 року за коментарем re: select elements @dariomac

$('select').prop("type");

поверне або "select-one", або "select-multiple", залежно від атрибута "multiple" та

$('select')[0].type 

повертає те саме для першого вибору, якщо він існує. і

($('select')[0]?$('select')[0].type:"howdy") 

поверне тип, якщо він існує, або "howdy", якщо його немає.

 $('select').prop('type');

повертає властивість першого в DOM, якщо воно існує або "невизначене", якщо такого немає.

$('select').type

повертає тип першого, якщо він існує, або помилку, якщо такої немає.

Ви можете зробити наступне:

var inputType = $('#inputid').attr('type');

Якщо ви говорите про те, що ви хочете отримати всі введення у формі, яка має значення, не турбуючись про тип введення, спробуйте це:

Приклад: http://jsfiddle.net/nfLfa/

var $inputs = $('form').find(':checked,:selected,:text,textarea').filter(function() {
    return $.trim( this.value ) != '';
});

Тепер у вас повинен бути набір вхідних елементів, які мають певне значення.

Ви можете помістити значення в масив:

var array = $inputs.map(function(){
    return this.value;
}).get();

Або ви можете їх серіалізувати:

var serialized = $inputs.serialize();

GetValue = function(id) {
  var tag = this.tagName;
  var type = this.attr("type");

  if (tag == "input" && (type == "checkbox" || type == "radio"))
    return this.is(":checked");

  return this.val();
};

$("#yourobj").attr('type');

Найкраще місце для початку шукати http://api.jquery.com/category/selectors/

Це дасть вам гарний набір прикладів.

Остаточно вибір елементів у DOM досягається за допомогою селекторів CSS, тому якщо ви думаєте про отримання елемента за ідентифікатором, ви хочете використовувати $ ('# elementId'), якщо ви хочете, щоб усі вхідні теги використовували $ ('input') і, нарешті, частина, на яку я думаю, що вам захочеться, якщо ви хочете, щоб усі теги вводу з типом прапорця використовували $ ('input, [type = checkbox])

Примітка. Більшість потрібних значень ви знайдете в атрибутах, тому селектор css для атрибутів є: [attributeName = value]

Тільки тому, що ви попросили спадне меню, призначене до списку, спробуйте наступне:

$('select, [size]).each(function(){
  var selectedItem = $('select, [select]', this).first();
});

Код був із пам’яті, тому, будь ласка, накопичуйте невеликі помилки

var val = $('input:checkbox:checked, input:radio:checked, \
   select option:selected, textarea, input:text',
   $('#container')).val();

Коментарі:

1. Я припускаю, що існує рівно один елемент форми, який може бути або текстовою областю, полем введення, обраною формою, набором перемикачів або одним прапором (вам доведеться оновити мій код, якщо вам потрібно більше прапорців).

2. Елемент, про який йде мова, знаходиться всередині елемента з ідентифікатором container(для усунення неоднозначностей з іншими елементами на сторінці).

3. Потім код поверне значення першого знайденого елемента, який він знайде. Оскільки я використовую :checkedі таке інше, це завжди має бути саме тим, що ви шукаєте.

Здавалося б, функція attr стає ще більш застарілою

$(this).attr('TYPE')
undefined
$(this).prop('type')
"text"

У своїй програмі я закінчив два різні елементи, що мають однаковий ідентифікатор (погано). Один елемент був дівом, а інший вкладом. Я намагався підбити підсумки і взяв трохи часу, щоб усвідомити повторювані ідентифікатори. Розмістивши тип потрібного елемента перед #, я зміг схопити значення вхідного елемента та відкинути div:

$("input#_myelementid").val();

Я сподіваюся, що це допомагає.

<!DOCTYPE html>
<html>

<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script>
        $(document).ready(function(){
          $(".show-pwd").click(function(){
          alert();
            var x = $("#myInput");
            if (x[0].type === "password") {
              x[0].type = "text";
            } else {
              x[0].type = "password";
            }
          });
        });
    </script>
</head>

<body>
    <p>Click the radio button to toggle between password visibility:</p>Password:
    <input type="password" value="FakePSW" id="myInput">
    <br>
    <br>
    <input type="checkbox" class="show-pwd">Show Password</body>

</html>

  <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <script type="text/javascript" src="hs/jquery1.js"></script>
        <title>Document</title>
    </head>
    <body>
        <form>
            <input type="text" class="tamil">
            <input type="button" class="english">
        </form>
        <script>
            $("input").addClass(function(index){
                    console.log($(this).attr('type'));
            })
        </script>
    </body>
    </html>

я отримую тип форми Райт