JQuery .html() 정확한 html 코드를 인쇄하십시오.

Question

붙여 넣기 할 사람이 코드로 채워지는 텍스트 영역이 있습니다. 붙여 넣기는 &입니다. 이 텍스트 영역은 JQuery 및 .html()을 사용하여 "채워집니다". 다른 페이지의 예에 <div>에서 나오는 "인구"로 : 인구 "보유"고

사업부 "

<div id="populationhold">this is the html to copy</div> 

를 다음"JQ의 마법은 클릭 "버튼 및 텍스트 영역을 채 웁니다"로 "

이제

function updatefunction(){ 
$('#textarea').html($('#populationhold').val(); }); 
} 

:

$('#button').click(function(){ 
updatefunction(); 
}); 

및 updatefunction 이 같은 비트입니다 나는 이런 식으로 뭔가 채워하려고하면 :

$('#textarea').html('this is the <br />html to copy'); 

들이게된다()뿐만 아니라 <br /><br>를 인쇄합니다. 나는 시도했다 (내 방식으로 <br \/>으로 탈출했지만 시도하지 않았다.) HTML4 코드가 아닌 깨끗한 XHTML 코드를 생성해야한다.

다음 비트는 prob이지만 똑같지 만 약간 더 복잡한 - 따라서 위의이로 이끌 당신이 코드 예제에서 비트를 추가/삭제할 수 있습니다 내 사이트의 "사용자"로

:.

<div id="populationhold"> 
<div class="codebit1">this is the <br />html to copy</div> 
\n<br/>\ 
<div class="codebit2">this is more <br />html to copy</div> 
</div> 

$('#button').click(function(){ 
$('#textarea').html($('#populationhold').val(); 
}); 

텍스트 영역을 채우기 괜찮 및 작품의 "90 %"는 다음과 같습니다.

$('#deletebutton').click(function(){  
$('.codebit1').remove(); 
// This removes .codebit1 from #populationhold and runs the update to ummm update the textarea with the update function 
// Note: remove() is OK in this case as #codebit1 is totally dynamically created 
updatefunction(); 
}); 

여기에서 질문은 삭제해야 할 비트를 삭제/삭제할 수 있습니다. 따라서 "90 %"는 제거 할 수 있지만, "지금 고아"를 없애려면 어떻게해야합니까? \n<br/>\n #textarea . OK \n<br/>\n 없이도이 작업을 수행 할 수 있지만 눈에 "깔끔하지 않은"코드를 복사하여 \n<br/>\n이있는 이유는 - \n<br/>\n도 실제로 코드를 복사 할 때 사용자가 적절한 레이아웃을 얻는 것을 보장합니다.

Answer 1

당신이하고있는 일이 정확하지 않다고 생각합니다.

<textarea>은 여러 줄 입력 개체입니다. 따라서 $('#textarea').html() 함수를 사용하고 싶지는 않지만 (<textarea>은 존재하지 않는다고 생각하지만) $('#textarea').val() 함수를 사용하여 내용을 업데이트하려고합니다.

$('#textarea').val('this is the <br />html to copy')을 수행하면 올바른 결과를 얻을 수 있습니다.

반면에 $('#populationhold') 개체의 경우 .val() 대신 .html()을 사용하고 싶은데, 그 이유는 값을 가져오고 그 자식이기 때문입니다. innerHTML을하고 XHTML

XHTML 및 innerHTML을 소개

은 친구도 없습니다. 그들은 단지 함께 일하지 않습니다. xhtml/xml로 문서를 제공하면 문제가 발생합니다. XML에서 innerHTML은 의미가 없습니다.

<element>value 
<child>childvalue</child> 
</element> 

innerHTML을 그것은 그냥 문자열 조작의 ... 다음, 바로 요소의 값을 가져옵니다 함수가 어린이의 이름과 값의 concatinates.

세미 용액

스티브 터커는 innerXHTML 기능을 만들었다. 현재 작업을 볼 수 있습니다

http://jsfiddle.net/pYUD4/10/

, 그러나, 당신은 <br />을 얻는 한 가지 <br></br>로 번역되어 있지만, 그러나 내가 아는 한, 그 유효한 XHTML입니다. 나는 지금 그것을 할 방법이없는 것처럼 보이기 때문에, 일을 잘하는 함수를 작성하려고 노력할 것이다. 하지만 시간이 좀 걸릴 수도 있습니다 xD