드롭 다운에서 wysiwyg에 텍스트 삽입

Question

jquery를 사용하여 부트 스트랩 Wysiwyg에 텍스트를 삽입하는 방법은 있습니까? 그건 그렇고,이 페이지에서 부트 스트랩 -wysihtml5를 사용했습니다. http://jhollingworth.github.io/bootstrap-wysihtml5/ 텍스트는 실제로 드롭 다운의 템플릿이며 선택한 onchange 값은 wysisyg에 삽입해야합니다.

는이 코드를 시도했지만 그것은뿐만 아니라 실제 WYSIWYG 편집기가에 있기 때문에 당신은 단순히 포함하는 페이지의 DOM에서 textarea에 액세스 할 수 없습니다

$(document).ready(function(e) { 
    $("#template").change(function(){ 
     var template = $("#template").val(); 
     if(template != '') { 
      $('.textarea, .wysihtml5-sandbox').append(template); 
     } 
    }); 
}); 

Answer 1

WYSIWYG 기능에 숨겨진 텍스트 영역에 텍스트를 삽입 .wysihtml5-sandbox 인 iFrame 그래서 iframe이의 DOM에 액세스하고 수정하기 위해, 우리는 iframe이 DOM에 처음 액세스해야합니다 :

$('.wysihtml5-sandbox').contents() 
    //Now we have the iFrame DOM to apply selectors to 

    $('.textarea', $('.wysihtml5-sandbox').contents()) 
    //Now we have access to the textarea which contains the editor's current text 

    $('.textarea', $('.wysihtml5-sandbox').contents()).append('Hello World!') 
    //Now we have appended content to the editor view, the original goal 

추가 재료 : 그것은 일

$('.textarea', $('.wysihtml5-sandbox').contents()).removeClass('placeholder') 
//Stops the text from being formatted as a placeholder (i.e. grayed out) 
$('.textarea', $('.wysihtml5-sandbox').contents()).empty() 
//Remove the existing placeholder text by emptying the textarea content