[javascript] 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”, “51729975c9f267f3b5000002”, prevObject : jQuery.fn.jQuery.init [3], 컨텍스트 : 문서, jquery : “1.9.1”, 생성자 : 함수, init : 함수…]

신분증 만 원합니다 (이 경우 처음 3 개 항목).

$.each값을 사용 하고 배열에 푸시 하여 원하는 출력을 얻습니다.

$("#find-table input:checkbox:checked").each(function(){ myArray.push($(this).val()); })

[ “51729b62c9f2673e4c000004”, “517299e7c9f26782a7000003”, “51729975c9f267f3b5000002”]

그러나 나는 $.map코드 줄을 절약하고 더 예쁘기 때문에을 사용하고 싶습니다 .

감사

답변

.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);
});

당 문서 :

반환 값은 배열을 포함하는 jQuery 객체이므로 결과에 대해 .get ()을 호출하여 기본 배열로 작업하는 것이 매우 일반적입니다.

답변

데모 : 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();

답변

함수 .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/

답변

나는 당신의 코드를 약간 리팩토링했고 당신이 찾고 있던 솔루션을 가지고 있다고 믿습니다. 기본적으로 값을 배열에 넣은 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);
});

코드가 실행 되는 바이올린 을 만들었습니다 .

답변

     var ids = [];

$('input[id="find-table"]:checked').each(function() {
   ids.push(this.value);
});

이것은 나를 위해 일했습니다!

답변

양식이 실제로 제출 된 것처럼 HTML에서 이름이 지정된 양식 요소가 자바 스크립트 객체의 배열이되도록 배열로 필요했습니다.

다음과 같은 여러 확인란이있는 양식이있는 경우 :

<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();
});

그리고 여기에 내 코드를 개선하는 데 도움이 된 수많은 답변이 있지만 너무 복잡하거나 내가 원하는 것을 정확히 원하지 않았습니다. jQuery를 사용하여 양식 데이터를 JavaScript 객체로 변환

작동하지만 개선 될 수 있습니다. 1 차원 배열에서만 작동하며 결과 인덱스는 순차적이지 않을 수 있습니다. 배열의 길이 속성은 실제 길이가 아닌 배열의 길이로 다음 인덱스 번호를 반환합니다.

이것이 도움이 되었기를 바랍니다. 나마스테!

답변

var idsArr = [];

$('#tableID').find('input[type=checkbox]:checked').each(function() {
    idsArr .push(this.value);
});

console.log(idsArr);