2016-10-30 2 views
0

Textarea вход дисплея на IFRAME Jquery

$('textarea').on('change keyup paste', function(){ 
 

 
$('#outputFrame').contents().find('html').html("<html><head><style type='text/css'>" + $('#cssArea').val() + "</style></head><body>" + $('#htmlArea').val() + "</body></html>"); 
 

 
});
<textarea id="htmlArea" placeholder="Enter HTML"></textarea> 
 
<textarea id="cssArea" placeholder="Enter CSS"></textarea> 
 
<iframe id="outputFrame" > 
 
</iframe>

Я пытался сделать проект, в котором каждый раз, когда я печатаю на моем HTML и CSS текстовое поле значение будет показано в IFRAME. Я уже сделал это, но есть ли другой простой способ написать сценарий jquery? Благодарю.

ответ

0

Почему бы не попробовать добавить заголовок и тело отдельно.

$('textarea').on('change keyup paste', function(){ 
    $('#outputFrame').contents().find('head').html("<style type='text/css'>" + $('#cssArea').val() + "</style>"); 
    $('#outputFrame').contents().find('body').html($('#htmlArea').val()); 
}); 

Рабочий Живой пример https://jsfiddle.net/L35bkedk/

Смежные вопросы