`

JavaScript选定textarea的特定行[转]

 
阅读更多
转至:http://school.cnd8.com/javascript/jiaocheng/50984.htm

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

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

<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)
        return;
    if(num == 0)
    {
       var right = rect[0].right;

       range.moveEnd("character",-range.text.length); 
       while(range.offsetLeft + range.boundingWidth < right)
       {
           range.expand("character");
       }
       return range;
    }
    else
    {
        var right = rect[num].right;

        var range = getTextRange(num - 1, areaId);
        range.moveStart("character",range.text.length + 1);
        while(range.offsetLeft + range.boundingWidth < right)
        {
            range.expand("character");
        }
        if(range.offsetLeft > left)
            range.moveStart("character",-1);
        return range;
    }
}

function getText(num)
{
    var range = getTextRange(num,"area")
    if(range != null)
    {
        alert(range.text);
        range.select();
    }
}
</SCRIPT>
<TEXTAREA cols="50" rows="10" id="area">
客从东方来,衣上灞陵雨。
问客何为来,采山因买斧。
冥冥花正开,扬扬燕新乳。
昨别今已春,鬓丝生几缕。
</TEXTAREA><p>

<input type="button" onClick="getText(0)" value="选第一行">
<input type="button" onClick="getText(1)" value="选第二行">
<input type="button" onClick="getText(2)" value="选第三行">
<input type="button" onClick="getText(3)" value="选第四行">
分享到:
评论

相关推荐

    JS在textarea光标处插入文本的小例子

    标题“JS在textarea光标处插入文本的小例子”和描述“本实例使用Javascript实现在textarea光标处插入文本,支持多种浏览器”揭示了该文档是关于如何使用JavaScript在网页文本区域(textarea)组件光标所在位置插入...

    javascript取消文本选定的实现代码

    在JavaScript中,有时候我们需要在用户进行特定操作时取消已经选定的文本,比如在实现拖动布局功能时,如果用户在拖动前选定了文本,可能会导致视觉上的不适。本篇文章将详细讲解如何使用JavaScript来取消文本选定,...

    javascript

    例如,可以编写函数来检查文本框是否为空,设置按钮的点击事件来执行特定的操作,或者动态地添加、删除选项等。通过实践项目,如“时间显示器”和“学生信息管理”界面,可以更好地理解和运用这些知识。 总的来说,...

    javascript 触发事件列表

    &lt;textarea name="liuyan" rows=5 cols=70 onchange="alert('值已改变')"&gt;&lt;/textarea&gt; ``` 在这个例子中,当用户在文本区域内修改内容后,页面会弹出一个警告框显示“值已改变”。 #### 三、选中文本事件(onselect)...

    JS实现选定指定HTML元素对象中指定文本内容功能示例

    本文将深入探讨如何使用JavaScript实现选定指定HTML元素对象中指定的文本内容,并提供一个具体的示例来帮助理解。 首先,我们要了解的是HTML元素中的文本选择。在JavaScript中,我们可以针对`&lt;input&gt;`或`&lt;textarea&gt;...

    精心整理的常用Javascript脚本

    1. **文本框焦点问题**:JavaScript提供了`onFocus`和`onBlur`事件,用于在文本框获得或失去焦点时执行特定操作。例如,当用户点击一个预填有默认值的文本框,可以通过`onFocus`清空内容,`onBlur`则在用户离开时...

    jQuery插件 文本框、文本域 光标处插入代码

    本主题聚焦于一个特定的jQuery插件,该插件允许开发者在文本框(`&lt;input type="text"&gt;`)和文本域(`&lt;textarea&gt;`)中于光标位置插入代码或内容。这对于编辑器、代码编辑器或任何需要动态插入文本的场景来说是非常...

    JQuery操作textarea,input,select,checkbox方法

    除了上述表单元素的特定操作外,JQuery还包含如`.click()`用于绑定点击事件、`.focus()`和`.blur()`用于处理聚焦和失去聚焦的事件、`.append()`用于向选定元素中添加新的内容等方法。 示例代码中还包含了JQuery的...

    Clipboardjs超轻量级剪贴板复制函数

    它只有大约50行代码,通过创建一个不可见的`textarea`元素来实现文本的复制,从而避免了复杂的浏览器兼容性问题。 【描述】: Clipboardjs的设计理念是简洁高效,它的核心思想是利用HTML5中的`execCommand`方法,...

    JS获取文本框光标位置、选中起始位置、终止位置、选择内容

    在JavaScript中,与文本框(`&lt;input type="text"&gt;`或`&lt;textarea&gt;`)相关的操作是常见的前端开发任务。特别是在交互式应用中,我们经常需要获取或设置用户输入时的光标位置、选中文字的起始和终止位置,以及获取选中...

    javascript 主动派发事件总结

    - 使用input/textarea.select()模拟文本选定,比如文本框或文本域的文本被用户选定。 - 使用focus()和blur()模拟元素获得焦点和失去焦点。 - 使用input/textarea/select.change()模拟输入框、文本域或选择框内容的...

    常用网页js脚本收集(可在线运行演示).pdf

    10. 在文字域添加`onclick`事件:可以在`&lt;textarea&gt;`的`&lt;font&gt;`标签内添加`onclick`事件,执行点击时的特定功能。 11. 打印功能:使用`javascript:window.print()`,可以创建一个链接或按钮,点击后直接打印当前...

    深入理解javaScript中的事件驱动

    JavaScript中的事件驱动编程是一种基于用户交互的编程模型,它使得脚本可以响应用户的特定操作,如鼠标点击、键盘按键等。这种模式极大地提高了Web应用程序的交互性和动态性。以下是关于JavaScript事件驱动的一些...

    JavaScript中textRange对象使用方法小结

    TextRange对象是一个抽象的概念,它定义了文档中一个特定文本区域的起始和结束点。 1. TextRange对象的常用属性: - `boundingHeight`:返回TextRange对象所覆盖文本的矩形高度。 - `boundingLeft`:返回矩形左...

    javascript 触发事件列表 比较不错

    JavaScript事件是网页交互的核心,它允许开发者在特定的时间点执行某些操作,如用户点击按钮、输入数据或滚动页面等。以下是一些常见的JavaScript触发事件及其详细解释: 1. **单击事件 (onclick)**:当用户点击...

    jQuery自定义添加删除问卷调查表单代码

    还可能包含对表单元素、按钮、提示信息等特定样式的定制,以确保问卷美观且用户友好。 `images`文件夹可能包含与问卷相关的图形资源,如图标、背景图片或指示性图像。这些图片可以增强用户的交互体验,比如用作选择...

    javascript获取以及设置光标位置

    这个函数接收一个DOM元素作为参数,该DOM元素应该是一个文本输入框或任何文本区域(如input、textarea等)。函数内部首先判断当前浏览器是否支持document.selection对象,这是一个IE浏览器特有的对象,如果支持,则...

    javascript在一段文字中的光标处插入其他文字

    在网页开发过程中,经常需要实现用户交互功能,其中一种常见的需求就是在文本框中特定位置插入文本。本文将详细介绍如何使用JavaScript实现在一段文字中的光标处插入其他文字的功能。 #### 一、问题背景与目标 在...

Global site tag (gtag.js) - Google Analytics