JQuery получает значения проверенных флажков в массив
Я пытаюсь получить значения всех флажков, которые в настоящее время проверяются, и хранить их в массиве. Вот мой код:
$("#merge_button").click(function(event){
event.preventDefault();
var searchIDs = $("#find-table input:checkbox:checked").map(function(){
return $(this).val();
});
console.log(searchIDs);
});
Однако это выводит больше, чем мне нужно. Я не только получаю значения, но и другие вещи, которые мне не нужны.
[ "51729b62c9f2673e4c000004", "517299e7c9f26782a7000003", Msgstr "context: document, jquery:" 1.9.1", конструктор: function, init: функция...]
Я хотел бы просто ID (первые 3 элемента в этом случае).
Используя $.each
и нажав значения в массив, я получаю желаемый результат:
$("#find-table input:checkbox:checked").each(function(){ myArray.push($(this).val()); })
[ "51729b62c9f2673e4c000004", "517299e7c9f26782a7000003", "51729975c9f267f3b5000002" ]
Однако я бы хотел использовать $.map
, так как он сохраняет мне строку кода и красивее.
Спасибо
Ответы
Ответ 1
Вызвать .get()
в самом конце, чтобы превратить полученный объект jQuery в истинный массив.
$("#merge_button").click(function(event){
event.preventDefault();
var searchIDs = $("#find-table input:checkbox:checked").map(function(){
return $(this).val();
}).get(); // <----
console.log(searchIDs);
});
Per документация:
Поскольку возвращаемое значение является объектом jQuery, который содержит массив, , он очень часто вызывает вызов .get() для результата для работы с базовым массивом.
Ответ 2
DEMO: http://jsfiddle.net/PBhHK/
$(document).ready(function(){
var searchIDs = $('input:checked').map(function(){
return $(this).val();
});
console.log(searchIDs.get());
});
Просто позвоните get(), и у вас будет свой массив, поскольку он написан в спецификациях: http://api.jquery.com/map/
$(':checkbox').map(function() {
return this.id;
}).get().join();
Ответ 3
Вам нужно добавить .toArray()
в конец вашей функции .map()
$("#merge_button").click(function(event){
event.preventDefault();
var searchIDs = $("#find-table input:checkbox:checked").map(function(){
return $(this).val();
}).toArray();
console.log(searchIDs);
});
Демо: http://jsfiddle.net/sZQtL/
Ответ 4
Я немного переработал ваш код и считаю, что пришел с решением, для которого вы искали. В основном вместо того, чтобы установить searchIDs
в качестве результата .map()
, я просто ввел значения в массив.
$("#merge_button").click(function(event){
event.preventDefault();
var searchIDs = [];
$("#find-table input:checkbox:checked").map(function(){
searchIDs.push($(this).val());
});
console.log(searchIDs);
});
Я создал fiddle с запущенным кодом.
Ответ 5
var ids = [];
$('input[id="find-table"]:checked').each(function() {
ids.push(this.value);
});
Это работало для меня!
Ответ 6
Не используйте "каждый". Он используется для операций и изменений в одном элементе. Используйте "карту" для извлечения данных из тела элемента и использования его где-то еще.
Ответ 7
Необходимы элементы формы, названные в HTML, как массив, который является массивом в объекте javascript, как если бы форма была фактически отправлена.
Если есть форма с несколькими флажками, например:
<input name='breath[0]' type='checkbox' value='presence0'/>
<input name='breath[1]' type='checkbox' value='presence1'/>
<input name='breath[2]' type='checkbox' value='presence2'/>
<input name='serenity' type='text' value='Is within the breath.'/>
...
Результатом является объект с:
data = {
'breath':['presence0','presence1','presence2'],
'serenity':'Is within the breath.'
}
var $form = $(this),
data = {};
$form.find("input").map(function()
{
var $el = $(this),
name = $el.attr("name");
if (/radio|checkbox/i.test($el.attr('type')) && !$el.prop('checked'))return;
if(name.indexOf('[') > -1)
{
var name_ar = name.split(']').join('').split('['),
name = name_ar[0],
index = name_ar[1];
data[name] = data[name] || [];
data[name][index] = $el.val();
}
else data[name] = $el.val();
});
И здесь есть тонны ответов, которые помогли улучшить мой код, но они были либо слишком сложными, либо не хотели, чтобы я хотел: Преобразование данных формы в объект JavaScript с помощью jQuery
Работает, но может быть улучшена: работает только на одномерных массивах, и полученные индексы могут не быть последовательными. Свойство length массива возвращает следующий индексный номер как длину массива, а не фактическую длину.
Надеюсь, это помогло. Намасте!