网站搜索

有没有一个 JavaScript/jQuery 选择器可以用于鼠标光标选中的文本?


是否有一个 jQuery 选择器可以选择被鼠标光标拖过而高亮的文本?例如,我想选择我在 textarea 字段中输入的文本,点击一个按钮,然后在我用鼠标光标高亮的文本周围添加 <p> 标签。最好使用非插件的解决方案,谢谢。

答案#1

有一个非常不错的直接 JavaScript 解决方案……只需使用 inputElement.selectionStart 和 inputElement.selectionEnd。

值得注意的是,这只是针对 DOM 元素使用的,所以你需要在你的 textarea 的 jQuery 选择器后面加上 [0] 来获取元素本身,即 $("#myTextArea")[0].selectionStart。

从那里你可以进行一些字符串操作,并在适当的索引处添加你的<p>标签。

我还没测试过,但它应该可以...

var selStart = $("#myTextArea")[0].selectionStart;
var selEnd = $("#myTextArea")[0].selectionEnd;

var originalString = $("#myTextArea").val();

var segment_1 = originalString.substr(0,selStart);
var segment_2 = originalString.substr(selStart,selEnd);
var segment_3 = originalString.substr(selEnd,originalString.length);

var finalString = segment_1 + "<p>" + segment_2 + "</p>" + segment_3;

$("#myTextArea").val(finalString);

答案#2

你为什么不用 PHP 来做这个?PHP + jQuery 会帮到你。

示例表格:

<form action="highlight.php" method="post">
My textarea:<br />
<textarea cols="10" rows="10" name="textarea"></textarea>
<input type="submit" value="Wrap <p> around" />
</form>

使用 PHP 处理表单并在其周围添加 <p> 标签:

<?php
$text = $_POST[''];
$wrap = '<p>'.$text.'</p>';

echo '<textarea cols="10" rows="10">'.$wrap.'</p>';
?>

你可以去掉 echo $wrap,但我更希望你学习 jQuery,以及如何使用它来执行 PHP 脚本。

我没有那么多 jQuery 经验来告诉你如何做,但学习它或者在谷歌上搜索“如何用 jQuery 执行 PHP 脚本”,我相信你会找到一些东西 =)