将大型js文件嵌入到一个页面中

时间:2014-02-27 12:36:19

标签: javascript html tinymce embed external

我想使用tinymce编辑器,但我的最终html文件不得包含任何源或css文件的链接。 我的意思是一定不能引用外部资源,它应该嵌入一个html中 (所有js文件和css文件)

性能不重要,目标浏览器仅为ie11。

我不想要任何

<script src=".."> or
<link rel="stylesheet" type="css" href="..">

我想要那个

<script>
function tinymce..
</script>

与样式信息相同也应该在这个html中,而不引用外部。

由于java应用程序(djbrowser)上的本机浏览器的限制,我可以部署一个文件,我不去 深入了解ie11与dj的技术细节。

可能吗?或任何方法?因为当我将tiny_mce.js直接复制粘贴到html中时失败了。原因可能是由document.write创建的动态脚本。

我的测试用例:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <!-- DO NOT CHANGE TITE -->
    <title>Editor</title>
    <link rel="stylesheet" type="text/css" href="tiny_mce/themes/advanced/skins/default/ui.css">       
    <link rel="stylesheet" type="text/css" href="tiny_mce/themes/advanced/skins/default/content.css">    

    <style>
        .mce-widget.mce-tooltip { display : none !important; }
    </style>

    <script type="text/javascript" src="tiny_mce/tiny_mce.js"></script>    
    <script type="text/javascript" src="tiny_mce/plugins/table/editor_plugin.js"></script>    
    <script type="text/javascript" src="tiny_mce/plugins/contextmenu/editor_plugin.js"></script>    
    <script type="text/javascript" src="tiny_mce/plugins/paste/editor_plugin.js"></script>    
    <script type="text/javascript" src="tiny_mce/themes/advanced/editor_template.js"></script>    
    <script type="text/javascript" src="tiny_mce/langs/en.js"></script>    
    <script type="text/javascript" src="tiny_mce/themes/advanced/langs/en.js"></script>



    <script type="text/javascript">

    function init() {
        // Check that tinymce exists
        if (typeof tinyMCE === 'undefined') {
                alert("tinymce.js is missing");
                return;
        }




        tinyMCE.init({
            mode : "textareas",
            theme : "advanced",
            plugins : "lists,style,linespace",

            theme_advanced_buttons1 : "bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull,|,fontselect,fontsizeselect,listbox",
            theme_advanced_buttons2 : "cut,copy,paste,|,outdent,indent,|,forecolor,backcolor",

            theme_advanced_toolbar_align : "left",
            theme_advanced_toolbar_location : "top",
            theme_advanced_statusbar_location : "bottom",
            theme_advanced_resizing : "true" 


        });
    }

            // Sets content
    function JH_setData(html) {
        try { 
            var oEditor = tinyMCE.activeEditor;
            oEditor.setContent(html);  
            //Check whether decoding needed
            //oEditor.setContent(decodeURIComponent(html));  
        } catch(e) { 
            //alert('exception occured' + e.description + ' ' + e.message);  
            return 'FAIL';
        }
        return 'OK';
    }

    // Gets the content
    function JH_getData() {
        var oEditor = tinyMCE.activeEditor; 
        var val = oEditor.getContent();  
        return val;
     }  

    function setContent() {
        JH_setData('test content');
    }

    function getContent() {
        var content = JH_getData();
        alert('content:' + content);
    }

    </script>
</head>
<body onLoad="init();">
    <textarea id="elm1" name="elm1" rows="15" cols="80" style="width: 100%;height:100%"></textarea>


<input type=button class="button_fu_class" style="position:absolute;top:30px;left:600px;width:80px;height:23px" value="SetContent" onClick="javascript:setContent();">
<input type=button class="button_fu_class" style="position:absolute;top:30px;left:700px;width:80px;height:23px" value="GetContent" onClick="javascript:getContent();">
</body>
</html>

有效,但是如果我将tiny_mce.sc复制到一个脚本块整页失败。

如果我替换

<script type="text/javascript" src="tiny_mce/tiny_mce.js"></script>   

 <script type="text/javascript">
 //content of tiny_mce.js 
 (function(d){var a=/^\s*|\s*$.....
</script>

失败

0 个答案:

没有答案