2012-05-08 3 views
0

Я использую Codemirror в одном из моих проектов. Вот код:Codemirror и iFrame issue

<script> 
window.onload = function() { 
var te = document.getElementById("js"); 
var te_html = document.getElementById("html"); 
var te_css = document.getElementById("css"); 

window.editor = CodeMirror.fromTextArea(te, { 
mode: "javascript", 
    lineWrapping: true, 
    }); 

window.editor_css = CodeMirror.fromTextArea(te_css, { 
    mode: "css", 
    lineWrapping: true, 
    }); 

    window.editor_html = CodeMirror.fromTextArea(te_html, { 
    mode: "text/html", 
    lineWrapping: true, 
    }) 
}; 
</script> 

Я также использую Jeffrey Way в «Как Inject пользовательского HTML и CSS в IFrame» сценарий, чтобы построить что-то похожее на Tinkerbin или JSFiddle.

Вот мой код для этой части:

<script type="text/javascript"> 
(function() { 
    $('.grid').height($(window).height());  

    var contents = $('iframe').contents(), 
    body = contents.find('body'), 
    styleTag = $('<style></style>').appendTo(contents.find('head')); 

    $('textarea').keyup(function() { 
     var $this = $(this); 
     if ($this.attr('id') === 'html') 
     { 
     body.html($this.val()); 
     } 
     else 
     { 
     styleTag.html($this.val()); 
     } 

    }); 

})(); 
</script> 

Это не все хорошо, за исключением того, что со сценарием CodeMirror активированном, ничего появляется на вкладке РЕЗУЛЬТАТ. И если я удалю часть кода CodeMirror, он отлично работает.

Вот мой проект ссылка:

http://mediodesign.ca/cms-test/

Кто знает, где это конфликт?

Спасибо!

ответ

0

Убедитесь, что вы загрузили все JavaScripts

mode/javascript.js 
mode/css.js 
mode/xml.js 

и если вы используете этот скрипт в файл XHTML. (') вместо двойных котировок (")

ex.

<script> 
window.onload = function() { 
var te = document.getElementById('js'); 
var te_html = document.getElementById('html'); 
var te_css = document.getElementById('css'); 

window.editor = CodeMirror.fromTextArea(te, { 
mode: 'javascript', 
    lineWrapping: true, 
    }); 

window.editor_css = CodeMirror.fromTextArea(te_css, { 
    mode: 'css', 
    lineWrapping: true, 
    }); 

    window.editor_html = CodeMirror.fromTextArea(te_html, { 
    mode: 'text/html', 
    lineWrapping: true, 
    }) 
}; 
</script> 

Jeffrey Way, Как Inject пользовательского HTML и CSS в IFRAME ... не имеет значения, от загрузки CodeMirror сценария