Question

여기서는 DOM (체크 상자 포함)을 프로그래밍 방식으로 div (id = "euiview")에 렌더링했습니다. 내 코드는 다음과 같습니다.

var iHtml='<span><input type="checkbox" id="cbox" data-dojo-type="dojox.mobile.CheckBox" onclick="toggleCheckbox()" class="addremove-check"><label for="cbox"> E&amp;U Imperatives </label> </span></p><p><span><input type="checkbox" id="cbox1" data-dojo-type="dojox.mobile.CheckBox" class="addremove-check"><label for="cbox1"> Transform the utility network </label></span></p>'; 

domConstruct.place(iHtml,"euiview"); 

여기에 HTML 페이지가있는 div가 있습니다.

<div id="euiview" data-dojo-type="dojox.mobile.View"> 

    </div> 

이제 문제는 내가 확인하거나 취소 일부 안드로이드 장치 브라우저에서 체크 상자를 선택 드릴 수 없습니다 만 데스크톱 브라우저에서 잘 작동합니다. 이 방법으로 HTML을 렌더링 할 수 있습니까? 아니면 프로그래밍 방식으로 DOM을 만들어야합니까? 도와주세요. 감사합니다.

Answer 1

페이지를 파싱 할시기에 따라 다릅니다. 뒤에 페이지 을 구문 분석하면 새 HTML을 추가해도 아무런 문제가 없습니다. 그러나 페이지 을 구문 분석하여 전에 추가하면 새 Dojo는 해당 DOM을 위젯으로 구문 분석하지 않으므로 선택란이 작동하지 않습니다.

DOM로드에 대한 페이지를 파싱한다고 가정합니다. 따라서 실제로 무엇이 먼저 실행되는지에 따라 달라집니다. 작동 할 수있는 솔루션은 다음과 같습니다.

var iHtml='<div id="new-content"><p><span><input type="checkbox" id="cbox" data-dojo-type="dojox.mobile.CheckBox" onclick="toggleCheckbox()" class="addremove-check"><label for="cbox"> E&amp;U Imperatives </label> </span></p><p><span><input type="checkbox" id="cbox1" data-dojo-type="dojox.mobile.CheckBox" class="addremove-check"><label for="cbox1"> Transform the utility network </label></span></p></div>'; 

domConstruct.place(iHtml,"euiview"); 
parser.parse("new-content"); 

이렇게하면 새 콘텐츠가 구문 분석되는지 확인할 수 있습니다. 또한 </p> 태그를 닫고 있지만 그 앞에 <p>을 넣지 않은 것으로 나타났습니다.