Вопросы Теги

Как получить тип ввода с помощью jquery?

У меня есть страница, где тип ввода всегда меняется, и мне нужно получить значения в зависимости от типа ввода. Так что, если тип является радио, мне нужно получить, который отмечен, и если это флажок, мне нужно сейчас, которые проверены, и если это выпадающий список, мне нужно знать, который выбран, и я, если это текст / текстовое поле Мне нужно знать значения.

Есть идеи, как это сделать?

135
задан Luci 2 July 2010 в 11:56
поделиться

7 ответов

ИЗМЕНИТЬ 1 февраля 2013 г. Из-за популярности этого ответа и изменений в jQuery версии 1.9 (и 2.0) в отношении свойств и атрибутов я добавил несколько примечаний и скрипку, чтобы увидеть, как это работает при доступе к свойствам / атрибутам на входе, кнопках и некоторых элементах выбора. Скрипка здесь: http://jsfiddle.net/pVBU8/1/

получить все входные данные: 

var allInputs = $(":input");

получить все входные данные тип: 

allInputs.attr('type');

получить значения: 

allInputs.val();

ПРИМЕЧАНИЕ: .val. () НЕ то же самое, что: checked для тех типов, для которых это актуально. use: 

.attr("checked");

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

.prop('checked');

или просто 

$(this).checked;

, чтобы получить значение чека - независимо от того, какой он сейчас. или просто используйте ': checked', если вам нужны только те, которые отмечены.

РЕДАКТИРОВАТЬ: Вот еще один способ получить тип: 

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

РЕДАКТИРОВАТЬ2: Обратите внимание, что форма: 

$('input:radio');

предпочтительнее, чем 

$(':radio');

, которые оба приравниваются к: 

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

, но желателен «ввод», поэтому он получает только входные данные и не использует универсальный '* ", когда форма $ (': radio') используется, что эквивалентно $ ('*: radio');

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

ИЗМЕНИТЬ 1 февраля 2013 г. на комментарий re: select elements @dariomac 

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

вернет либо «select-one», либо «select-multiple» в зависимости от атрибута «множественный», а 

$('select')[0].type

возвращает то же самое для первого выбора, если он существует. а 

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

вернет тип, если он существует, или «привет», если его нет. 

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

возвращает свойство первого объекта в DOM, если оно существует, или «undefined», если его нет. 

$('select').type

возвращает тип первого, если он существует, или ошибку, если его нет.

244
ответ дан 23 November 2019 в 23:44
поделиться

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

Пример: 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();
9
ответ дан 23 November 2019 в 23:44
поделиться

Вы можете сделать следующее: 

var inputType = $('#inputid').attr('type');
15
ответ дан 23 November 2019 в 23:44
поделиться 
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();
};
7
ответ дан 23 November 2019 в 23:44
поделиться 
$("#yourobj").attr('type');
4
ответ дан 23 November 2019 в 23:44
поделиться

Лучшее место для начала поиска - http://api.jquery.com/category/selectors/

Это даст вам хороший набор примеров.

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

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

Просто потому, что вы запросили раскрывающийся список, связанный со списком, попробуйте следующее: 


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

Код был из памяти, поэтому, пожалуйста, учитывайте небольшие ошибки

4
ответ дан 23 November 2019 в 23:44
поделиться 
var val = $('input:checkbox:checked, input:radio:checked, \
   select option:selected, textarea, input:text',
   $('#container')).val();

Комментарии:

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

  2. Рассматриваемый элемент находится внутри элемента с идентификатором контейнера (для устранения двусмысленности с другими элементами на странице).

  3. Затем код вернет значение первого найденного совпадающего элемента . Поскольку я использую : checked и так далее, это всегда должно быть именно то значение, которое вы ищете.

3
ответ дан 23 November 2019 в 23:44
поделиться
Другие вопросы по тегам:

Похожие вопросы: