我正在研究一位非常专业的编辑。简而言之,我起草了一个在firefox中运行的代码示例(如下)。 iText功能将填写示例内容。
用户应该选择示例内容的一部分来命中“Letters”,然后iLetter函数应该只采用句子的选定部分,并且只在选择中将大写字母反转为小写字母和小写字母或大写字母(反转本身不是问题)。
我搜索了几个小时如何在显示的文本/字符串中获取选择的位置或如何获得开始和结束位置。如果我可以提取选择,将其修改为字符串(我管理它)并用修改后的字符串替换选择(我失败了),那将是很好的。有可能吗?任何提示或建议都非常受欢迎。
<html>
<head>
<script>
function iFrameOn(){
richTextField.document.designMode = 'On';
}
function iText(){
window.frames['richTextField'].document.body.innerHTML = "Hello World ready for simple text trial?";
}
function iLetters(){
var range = window.frames['richTextField'].getSelection();
range.deleteFromDocument();
}
</script>
</head>
<body onLoad="iFrameOn();">
<h2>Edit Test</h2>
<form action="parse_file.php" name="form" id="form" method="post">
<p>
<div id="wysiwyg_cp" style="padding:8px; width:700px;">
<input type="button" onClick="iText()" value="Text">
<input type="button" onClick="iLetters()" value="Letters">
</div>
<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>
<!-- End replacing your normal textarea -->
</p>
</form>
</body>
</html>
答案 0 :(得分:0)
我想通了......一个很大的帮助是:
replace selected text in contenteditable div
该函数仅将其设置为小写,但这是一个简单的修改,以保持示例紧凑。
<html>
<head>
<script>
function iFrameOn(){
richTextField.document.designMode = 'On';
}
function iText(){
window.frames['richTextField'].document.body.innerHTML = "HELLO WORLD READY FOR A SIMPLE TEXT TRIAL?";
}
function iLetters(){
var sel, range;
if (window.frames['richTextField'].getSelection) {
sel = window.frames['richTextField'].getSelection();
var theSelection = sel.toString();
var replacementText = theSelection.toLowerCase();
if (sel.rangeCount) {
range = sel.getRangeAt(0);
range.deleteContents();
range.insertNode(window.frames['richTextField'].document.createTextNode(replacementText));
}
}
}
</script>
</head>
<body onLoad="iFrameOn();">
<h2>Edit Test</h2>
<form action="parse_file.php" name="form" id="form" method="post">
<p>
<div id="wysiwyg_cp" style="padding:8px; width:700px;">
<input type="button" onClick="iText()" value="Text">
<input type="button" onClick="iLetters()" value="Letters">
</div>
<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>
<!-- End replacing your normal textarea -->
</p>
</form>
</body>
</html>
&#13;