2012-03-07 98 views
0

是否有用標籤包裝textarea文本? 的Javascript/Jquery的Javascript包裝帶標籤bbcode的文本?

B =粗體I =斜體U =下劃線S =擊

例如:

-+-+-+-+- 
B I U S 
-+-+-+-+- 
<textarea> 
Some text here 
</textarea> 

當我突出 「這裏」,然後單擊大膽的將是這樣的行爲。

-+-+-+-+- 
B I U S 
-+-+-+-+- 
<textarea> 
Some text [b]here[/b] 
</textarea> 

希望我會找到解決方案 ,這是它的感謝。

回答

3

這是溶液

function wrapText(elementID, openTag, closeTag) { 
    var textArea = $('#' + elementID); 
    var len = textArea.val().length; 
    var start = textArea[0].selectionStart; 
    var end = textArea[0].selectionEnd; 
    var selectedText = textArea.val().substring(start, end); 
    var replacement = openTag + selectedText + closeTag; 
    textArea.val(textArea.val().substring(0, start) + replacement + textArea.val().substring(end, len)); 
} 
1

使用率

console.log(parseBB('[b]hello [/b][u]world[/u]')); 
console.log(parseBB(document.getElementById('textareaID').value)); 
console.log(parseBB($('#textareaID').val())); 

測試用例

$('#output-container').html(parseBB($('#textareaID').val())); 

..

function parseBB(string){ 
var _string = string.replace(/\n/g, '<br>'), 
parseExp = new RegExp(/^(.*)\[(b|u|i|s)\]([A-Za-z0-9 ._-]+)\[\/[a-z]+\](.*)$/g); 

(function run(){ 
    if(parseExp.test(_string)){ 
     _string = _string.replace(parseExp , '$1<$2>$3</$2>$4'); 
     run(); 
    } 
})(); 
return _string; 
}