Wysiwyg使每個單詞可點擊？

好的。我有一個可編輯的div，可以輸入一些文本。但進入後，我有3個按鈕：黑色，黃色和綠色。Wysiwyg使每個單詞可點擊？

我想做的事情是，然後點擊ie按鈕「黑色」，然後單擊我已輸入到可編輯區域的每個單詞。點擊一個單詞後，單擊的單詞應該包含div class ='black'？

此外，如果再次單擊相同的單詞，我需要刪除包裝的div（所以我可以撇開單詞的顏色，如果我希望這樣做？）。

此外，我想div被刪除，如果我刪除任何用div包裹的話。

任何幫助表示讚賞？

在此先感謝。

2012-07-01 Mads Christian Sidenius

歡迎您！在發佈問題時，請考慮在問題中包含相關代碼（腳本，標記，樣式）以瞭解您的問題和方法，並且如果可能，請使用http://jsfiddle.net工作[demo]（http：// www。 yoda.arachsys.com/csharp/complete.html）。 '：'' –

你使用jQuery嗎？你需要類似的東西：

function prepareDivContainer() 
{ 
    // remove extra spaces 
    var str = $("#editableDiv").text().replace(/[\s]+/g, ' '); 

    // split the string by space into words 
    var words = str.split(' '); 

    // clear the content of the editable div 
    $("#editableDiv").text(''); 

    // insert each word wrapped with a div 
    for (var i = 0; i < words.length; i++) 
    { 
    $("#editableDiv").append('<div id="word'+i+'">'+words[i]+'</div>'); 
    } 
}

這個函數在用戶完成在div中插入文本後調用。它會把所有的單詞都包含在div中。

所以，現在你可以通過綁定到點擊事件做出這些div（字）點擊：

$(document).ready(function() { 
    $("#editableDiv div").live("click", function(){ 
    // do something with the clicked word (div), e.g. add or remove css classes 
    // look here: http://api.jquery.com/category/css/ 
    }); 
});

來源

2012-07-01 22:42:02 Besnik

問題上唯一的標籤是'[jquery]'，所以我認爲這樣做是安全的。 ';）' –

嗨Jared。我想這會讓我一半:)。我只需要在周圍沒有div的單詞旁邊添加div。或者我最終會用幾個div來包裝單詞。我需要刪除div，如果我刪除這個單詞（或許多單詞）與他們。但是，感謝這個想法。我想如果我可以拆分每個單詞的div包裝，然後通過空格，我可以設法做我想做的事:) –

Wysiwyg使每個單詞可點擊？

回答

相關問題