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 массива возвращает следующий индексный номер как длину массива, а не фактическую длину.

Надеюсь, это помогло. Намасте!