2011-05-09 5 views
1

div 태그에 일련의 제품을로드하는 스크립트를 작성했습니다.jQuery에 동적으로로드 된 체크 박스가 표시되지 않습니다.

이제 일련의 체크 박스를 사용하여 해당 제품을 필터링 할 수 있기를 원합니다.

jquery는 XML 데이터 집합을 반환하는 ASP 페이지에 $ 게시를 만듭니다. 데이터 세트의 첫 번째 요소에는이 형식의 제조업체 목록이 포함되어 있습니다. 두 번째 요소에는 위 코드의 제조업체 이름이 들어 있습니다.

그런 다음이 스크립트를 사용하여 div 태그에 체크 박스 목록을 작성하십시오.

var mc = new Array(); 
mc = $("manCodes",xml).text().split(","); 
var manTitles = new Array(); 
manTitles = $("manTitles",xml).text().split(","); 

for (var i=0, len=mc.length; i<len; ++i){ 
    m += '<span><input type="checkbox" value="' + mc[i] + '" name="man[]" id="man_'+i+'" />' + manTitles[i] +'</span>'//mc[i]; 
    } 
manufacturers = '<div id="filter" class="man">FILTER<br />' + m + '</div>'; 
$(".formSelect").append(manufacturers); 

이 치료를 작동 한 후 문서 준비 섹션에서 내가 체크 박스에 어떤 클릭을 찾는 코드 세그먼트가 있습니다

$(document).ready(function() { 
    $("input:checkbox").click(function() { 
    loadXML($("#sortOrder option:selected").val(),$("#limitBy option:selected").val(),$("#productGroup").val()); 
    }); 
}); 

에 어떤 클릭 때문에 내 코드는 이상 떨어질 곳입니다 모든 체크 박스가 작동하지 않습니다. JQuery와 거의 비슷하게이 확인란을 만들 수 없습니다.

누구든지이 문제를 해결하는 방법을 알려주십시오.

건배 그레이엄

+0

사용 (http://api.jquery.com/live/) ['()'라이브] ... 놀라 울 정도로 빨랐다 –

답변

1

당신은 그렇지 않으면 이벤트 핸들러가 동적으로 삽입/제거 요소 발생하지 않습니다, 이벤트 위임이 필요합니다. .live 또는 .delegate은 두 가지 옵션입니다.

$("input:checkbox").live("click", function() { 
    // implementation 
}); 

이상 :

$("form").delegate("input:checkbox", "click", function() { 
    // implementation 
}); 
1

사용 jQuery.live() 동적으로 추가 요소에서 이벤트를 캡처.

는 현재와 미래, 현재 선택 일치하는 모든 요소에 대한 이벤트 핸들러를 연결합니다.

$("input:checkbox").live("click", function() { 
    loadXML($("#sortOrder option:selected").val(),$("#limitBy option:selected").val(),$("#productGroup").val()); 
}); 
0

시도 :

$(document).ready(function() { 
    $("input:checkbox").live("click",function() { 
    loadXML($("#sortOrder option:selected").val(),$("#limitBy option:selected").val(),$("#productGroup").val()); 
    }); 
}); 
+0

, 감사합니다 순전히. 대접을 받았는데,이게 무슨 일인지 설명해 주시겠습니까? – EvilKermitSaurus

+0

클릭하면 DOM에 현재 표시되는 체크 박스에 이벤트가 바인딩됩니다. 이 이벤트 바인딩은 새 확인란을 만들기 전에 발생하므로 새 확인란은 이벤트 수신기에 연결되지 않습니다. 라이브 메소드는 나중에 추가되는 요소 (이 경우에는 체크 박스)에서 작동합니다. 즉 "라이브"라는 이유입니다. – Ankur

+0

Brillian이 도움을 주셔서 대단히 감사합니다 !!! – EvilKermitSaurus

관련 문제