contentEditable div의 HTML을 숨겨진 텍스트 양식 요소 내부로 가져 오려면 어떻게해야합니까?

Question

난 당신이 바로 콘텐츠 편집 사업부에서 입력을 사용할 수 있다고 생각하고 형태로 제출, 그래서 난 그냥 숨겨진 텍스트 필드가이 같은 것을 할 수 있다고 생각하지 않습니다

var blog_post = $("#editable_div").html(); 
$('#hidden_text_area').val(blog_post); 

을

누구든지이 작업을 수행 할 수있는 방법을 알고 있습니까? 내가 가지고있는 것과는 작동하지 않습니다. $('#hidden_text_area').val(blog_post);이 이벤트에 의해 트리거되어야한다고 생각했지만 클릭으로 시도했지만 작동하지 않았습니다.

$('#clicker').click(function(){ 
    $('#hidden_text_area').val(blog_post); 
}) 

Answer 1

시도 :

$('#clicker').click(function(){ 
var blog_post = $("#editable_div").html(); 
$('#hidden_text_area').val(blog_post); 
}) 

당신의 blog_post 변수가이 버튼을 클릭 HTML 콘텐츠에 포함 된 것처럼 보이지 않기 때문에.

HTML :

<textarea id="content"> 
    <p style="background-color: blue;">Testing</p> 
</textarea> 
<input type="button" value="hit me" id="btn" /> 
<div id="parent"> 
    <input type="text" name="testinput" id="inputtest" value="" /> 
</div> 

JS :

$("#btn").click(function() { 
    var html_contents = $("#content").html(); 
    $("#inputtest").val(html_contents); 
}); 

Answer 2

경고 ($ ('#의 hidden_text_area')) 객체를 제공되지 않았거나 확인하시기 바랍니다. 객체를 제공하지 않으면 문제가 발생합니다. $ ('# hidden_text_area'). val (blog_post); 작동해야합니다.

Answer 3

그러나 값 속성에 HTML을 탈출된다는 점에 유의하시기 바랍니다, 나를 위해 잘 작동하는 것 같다 [object Object]를 반환하는 중