指定选取textarea的特定行

最新推荐文章于 2022-01-30 11:15:54 发布

LxcJie

最新推荐文章于 2022-01-30 11:15:54 发布

阅读量1.8k

点赞数

分类专栏： javascript 文章标签： character button input function javascript html

本文链接：https://blog.csdn.net/lxcjie/article/details/90334

版权

本文介绍了一种JavaScript方法，用于在不依赖回车换行的情况下，获取textarea中的指定行。通过封装的getTextRange函数，传入textarea的行号和ID，可以返回指定行的range对象。该方法适用于字符过宽导致的自动换行情况，提供了灵活性，并可通过range对象的text属性获取文本。示例代码中展示了如何使用此方法并提供了交互按钮，让用户可以选择textarea的特定行。

摘要由CSDN通过智能技术生成

通常状况下,大家都使采用判断来判断textarea控件中含有多少行,但是,有这么一种情况,就是没有使用回车,而是字符过宽而textarea自动换的行,很显然,上面那种方法就不可行了.

这里,我封装了一个方法getTextRange(num, areaId),这个方法只需要传入textarea的id及其需要的行号,即可以返回指定行,为了灵活,这里没有返回指定行的文本,而是返回了指定行的一个trange对象,如果需要文本,只需调用trange对象的text属性即可.

把下面的代码拷贝到一个htm文件中即可以看到效果.

<HTML>
<HEAD>
<META http-equiv="Content-Type" content="text/html; charset=gb2312">
<SCRIPT language="javascript">
/**
* added by LxcJie 2004.7.16
* 返回指定行的range对象
* num为行号，areaId为textarea的id
*/
function getTextRange(num, areaId)
{
    var range = document.all(areaId).createTextRange();
    var rect = range.getClientRects();
    var left = rect[0].left;
    if(num > rect.length - 1 || num < 0)<