使用executeCommand應用自定義css類或id

我想構建自定義wysiwyg，就像使用代碼標記的stackoverflow wysiwyg。我創建代碼按鈕，以將css樣式應用於css類mycode，並且我想要使用executeCommand應用按鈕單擊。我嘗試，但沒有奏效。使用executeCommand應用自定義css類或id

CSS代碼

.mycode{ 
    font-family:"Lucida Console", Monaco, monospace; 
    background-color:#d1d1d1; 
    padding:5px 10px; 
}

JavaScript代碼

function iFrameOn(){ 
    richTextField.document.designMode = 'On'; 
} 

function iCode(){ 
    richTextField.document.execCommand("styleWithCSS", 0, false); 
    richTextField.document.execCommand(".mycode", 0, true); 
}

和HTML代碼

<body onLoad="iFrameOn();">   
    <input type="button" onClick="iCode()" value="Code"> 
<textarea style="display:none;" name="myTextArea" id="myTextArea" cols="100" rows="14"></textarea> 
<iframe name="richTextField" id="richTextField" style="border:#000000 1px solid; width:700px; height:300px;"></iframe> 
</body>

我如何使用executecommand()應用自定義CSS類的任何建議。

來源

2013-04-10 user2236292

如果我明白你想要做什麼：你想應用一個自定義的CSS點擊一個按鈕。

如果這是你必須輸入你的CSS的方式略有不同的情況：

CSS：你可以看到，在一開始應用的CSS的正常進行，那些我不想改變我用的是@import url

<!-- 
    stylesheet 
--> 
<style type="text/css">@import url("stylesheets/default.css");</style> 
<style type="text/css">@import url("stylesheets/social.css");</style> 
<!-- cube style to allow CSS change --> 
<style type="text/css">@import url("stylesheets/default-cube.css");</style> 

<link rel="stylesheet" href="stylesheets/blackandwhite.css" />

然後，當我想加載不同的CSS文件，我改變attr

jQuery的

$('#changeco').click(function(){ 
    $("link").attr("href", "stylesheets/colour.css"); 
    return false; 
});

有關工作示例，請參閱單擊彩色/黑白框。

http://portfolio.chrisloughnane.net/

的jsfiddle不喜歡硬編碼進口，所以我只是INC。上面的鏈接。

來源

2013-04-15 13:37:00

使用executeCommand應用自定義css類或id

回答

相關問題