即使有换行符捕获光标位置中的所有内容,也将特殊标签应用于所有选定文本中的文本区域
Posted
技术标签:
【中文标题】即使有换行符捕获光标位置中的所有内容,也将特殊标签应用于所有选定文本中的文本区域【英文标题】:Apply special tags to textarea in all selected text even if there are newline capturing all contents in cursor poisition 【发布时间】:2013-09-29 10:51:01 【问题描述】:下面的示例将标记 [code] 和 [/code] 写入 textarea 中的选定文本,但仅应用于字符串的开头和结尾...我想要 [code] 和 [/code] 应用于将换行符视为新字符串的字符串的每个部分...
发布的示例执行:
[code]test
test
test[/code]
我想申请:
blablabla...
[code]test[/code]
[code]miao miao[/code]
[code]this is teh 3rd string[/code]
etcetera, some extra string
如您所见,我想应用代码仅选定的字符串,考虑使用换行符的新字符串...在纯 javascript 中可能吗?没有 jquery 或 mootools,请仅使用独立脚本...
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<title>[javascript code]</title>
<script language="JavaScript" type="text/javascript">
var myValueBefore = "[code]";
var myValueAfter = "[/code]";
function applyCode(myField, myValueBefore, myValueAfter)
if (document.selection)
myField.focus();
document.selection.createRange().text = myValueBefore + document.selection.createRange().text + myValueAfter;
else if (myField.selectionStart || myField.selectionStart == '0')
var startPos = myField.selectionStart;
var endPos = myField.selectionEnd;
myField.value = myField.value.substring(0, startPos)+ myValueBefore+ myField.value.substring(startPos, endPos)+ myValueAfter+ myField.value.substring(endPos, myField.value.length);
</script>
</head>
<body>
<br><br><br>
<table align="center" border="0" cellpadding="15" cellspacing="0" >
<tr>
<td>
<form action="#" method="post">
<input type="button" value="Apply Code" onclick="javascript:applyCode(test, myValueBefore, myValueAfter);"><br>
<textarea rows="5" cols="130" name="test"></textarea>
</form>
</td>
</tr>
</table>
</body>
</html>
【问题讨论】:
【参考方案1】:你可以进一步开发这个coden-p:
var myValueBefore = '[code]',
myValueAfter = '[/code]';
function applyCode(myField, myValueBefore, myValueAfter)
var newLine = new RegExp('\n|\r\n', 'g'), range, selectedText, beforeSelectedText, afterSelectedText;
if (document.selection)
range = document.selection.createRange();
range.text = myValueBefore + range.text.replace(newLine, myValueAfter + '\n' + myValueBefore) + myValueAfter;
return;
else
beforeSelectedText = myField.value.substring(0, myField.selectionStart);
afterSelectedText = myField.value.substr(myField.selectionEnd);
selectedText = myField.value.substring(myField.selectionStart, myField.selectionEnd);
myField.value = beforeSelectedText + myValueBefore + selectedText.replace(newLine, myValueAfter + '\n' + myValueBefore) + myValueAfter + afterSelectedText;
return;
A live demo at jsFddle.
【讨论】:
我在IE8下遇到问题,在IE8下有两个换行符而不是一个,如何修复IE? @user1582059 对不起,我无法重现这个问题,虽然我只能用 IE10 模拟 IE8。您可以尝试将'\r\n'
作为 RegExp 参数。
我错了...问题是 IE...不是很重要的版本,因为我在 Windows 7 上尝试使用 IE 10.00 并且问题仍然存在...所以我该如何解决IE问题? IE 增加了两个换行符而不是一个...这并不冗长...
@user1582059 现在我明白了:)。看起来 IE 在textarea
中也使用了\r\n
。我已经更新了我的答案。
感谢您修复 IE 问题 :)以上是关于即使有换行符捕获光标位置中的所有内容,也将特殊标签应用于所有选定文本中的文本区域的主要内容,如果未能解决你的问题,请参考以下文章