<textarea> jQuery()를 호출 한 후 요소가 비어 있습니다. wrapInner

Question

텍스트 영역이 있고 div로 내용을 래핑하려고합니다.

되는 HTML

<textarea class="wp-editor-area" rows="20" autocomplete="off" cols="40" name="wprss_ftp_post_prepend" id="wprsspostprepend">Hello World!</textarea> 

JQuery와

jQuery(document).ready(function($){ 
    $('#wprsspostprepend').wrapInner("<div id='random-wrap'></div>"); 
}); 

나는 그것이 내용이 경우에도 텍스트 영역의 빈 잎이 코드를 실행하면, 내가 잘못되고있는 것이 무엇인지에 대한 손실에입니다.

Answer 1

textarea에는 리터럴 텍스트 만 포함될 수 있습니다. 당신은, 태그 편집기 내에서 허용 할 대신 pre 요소를 사용하는 경우 :

jQuery(document).ready(function ($) { 
 
    $('#wprsspostprepend').wrapInner('<div id="random-wrap"/>') 
 
})

.wp-editor-area { 
 
    width: 30em; 
 
    height: 20em; 
 
    border: 1px solid #ccc; 
 
} 
 

 
#random-wrap { 
 
    color: #f00; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<pre class="wp-editor-area" autocomplete="off" name="wprss_ftp_post_prepend" contenteditable="true" id="wprsspostprepend">Hello World!</pre>