`

javascript的focus函数如何定位到textarea指定地方

 
阅读更多

转:http://hi.baidu.com/codylee/item/df0caf12773b73eb9913d667

 

今天编程的时候遇到了个问题. 就是客户希望页面载入后吧鼠标定位到一个textarea的开始部分. 本来javascript的focus函数可以解决的. 但问题是当当textarea里面有内容的时候. 鼠标就定位到了内容的后面. 必须自己写函数来实现定位到头部的功能.

说明一下

setSelectionRange是mozilla特有的函数
createTextRange是IE特有的函数

所以代码浏览器兼容的问题就解决了.

附js代码 XXX为你设置的textarea的id

<script type=”text/javascript” language=”javascript” >

function setCursor(el,st,end) {
if(el.setSelectionRange) {
       el.focus();
       el.setSelectionRange(st,end);
} else {
  if(el.createTextRange) {
       range=el.createTextRange();
       range.collapse(true);
       range.moveEnd(”character”,end);
       range.moveStart(”character”,st);
       range.select();
  }
}
}

function text_curser() {
setCursor(document.getElementById(”XXX”), 0, 0)
}

window.onload = text_curser;
</script>

分享到:
评论

相关推荐

    将光标定位到textarea的某一行的javascript代码

    总结来说,通过这段代码,我们可以学习到如何使用JavaScript来实现`textarea`光标的动态定位,这对于提升用户在多行文本编辑场景下的交互体验具有重要意义。同时,了解不同浏览器对光标操作的支持差异也是前端开发者...

    Vue指令你可以很方便地对页面中所有input和textarea的自动聚焦行为进行流程控制

    &lt;textarea v-auto-focus&gt;&lt;/textarea&gt; ``` 这样,每当这些元素被渲染到页面上时,就会自动获得焦点。但是,有时候我们可能不希望所有情况下都自动聚焦,这时可以传递参数给自定义指令,根据参数决定是否聚焦: ```...

    在textarea光标处插入文本

    本文将详细介绍如何使用JavaScript在`textarea`的光标位置插入文本。该方法适用于多种浏览器环境,包括Internet Explorer(IE)和其他基于Mozilla的浏览器(如Firefox)。我们将通过分析提供的代码示例来深入理解其...

    javascript textarea光标定位方法(兼容IE和FF)

    总结起来,JavaScript 的 textarea 光标定位涉及到 `setSelectionRange` 和 `createTextRange` 这两种方法,通过条件判断实现跨浏览器兼容性。理解和掌握这些方法,可以帮助开发者在各种浏览器环境中提供一致的用户...

    jQuery实现在textarea指定位置插入字符或表情的方法

    在聊天、论坛或者博客评论等应用场景中,用户可能需要在输入的文字中插入特定的字符,比如表情符号,而这些字符需要被精确地定位到用户当前的光标位置。为此,我们需要编写一个jQuery扩展方法来实现这一功能。 1. *...

    使用JS在textarea在光标处插入内容

    在IT领域,特别是前端开发中,使用JavaScript在`textarea`元素的光标位置插入内容是一项常见且实用的技术。本文将详细解析如何实现这一功能,并深入理解其背后的逻辑与原理。 ### 核心知识点:在`textarea`光标处...

    textarea在文本之后获得焦点,适合ie,火狐,谷歌

    以下是一个基本的JavaScript函数,它会在用户按下回车键时,使`textarea`重新获取焦点: ```javascript document.getElementById('myTextarea').addEventListener('keyup', function(event) { if (event.keyCode =...

    javascript实现 在光标处插入指定内容

    在javascript代码中,我们首先获取了TEXTAREA元素的引用,并将其focus设置为true,这样可以确保文本框获取了焦点。然后,我们使用document.selection.createRange()方法创建了一个范围对象,这个对象可以帮助我们...

    JS在TextArea光标位置插入文字并实现移动光标到文字末尾

    在JavaScript中,操作文本输入域,如`&lt;textarea&gt;`,涉及到光标位置的处理时,通常需要使用到浏览器提供的API。对于不同的浏览器,这些API可能会有所差异。在处理`&lt;textarea&gt;`光标位置插入文字并移动光标到文字末尾的...

    Textarea根据内容自适应高度

    这个功能可以通过JavaScript来实现,正如标题“Textarea根据内容自适应高度”所描述的那样。本文将详细介绍如何使用JavaScript来控制`Textarea`的内容自适应高度,并提供相关代码示例。 首先,我们来看一下提供的...

    教你一天玩转JavaScript(五)——使用JavaScript完成注册页面表单提示及校验

    而在`validateInput`函数中,我们传入一个验证函数(如检查用户名是否为空),如果验证失败,则弹出警告并重新聚焦到该输入框。 对于密码输入,我们可能需要更复杂的验证规则,比如确认密码是否匹配。这可以通过...

    jQuery往textarea中光标所在位置插入文本的方法

    本文主要介绍如何使用jQuery在textarea元素中光标所在位置插入文本的技术,涉及到的操作和概念包括jQuery库的使用、文本框(textarea)的光标定位与操作、JavaScript中的字符串操作等。文章首先定义了jQuery的扩展...

    JavaScript实现复制内容到粘贴板代码_.docx

    在JavaScript中,复制内容到剪贴板的操作是前端开发中常见的功能,比如用户在网页上点击复制按钮将文本信息快速存入系统粘贴板。在本文中,我们将深入探讨如何利用JavaScript实现这一功能,以及涉及的安全问题。 ...

    Javascript验证大全

    这个函数会在提交表单时检查textarea的值,如果长度超过50,会弹出警告并阻止表单提交。 2. 只能输入汉字:如果需要限制输入框只允许输入汉字,可以利用正则表达式进行替换: ```html (/[^\u4E00-\u9FA5]/g, '')"&gt; ...

    JavaScript表单验证

    2. 事件监听:利用`addEventListener`方法监听用户操作,如`'submit'`、`'change'`、`'focus'`和`'blur'`,在事件触发时执行验证函数。 3. 正则表达式:JavaScript的`test()`或`match()`方法可以配合正则表达式进行...

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

    在JavaScript中,有时我们需要在textarea元素的光标位置插入文本,比如实现一个简单的富文本编辑器功能。这个小例子展示了如何使用JavaScript实现这个功能。在HTML文档中,我们可以通过监听用户的交互事件,如点击...

    javascript处理表单大全

    当用户在文本框中输入超过指定长度时,通过JavaScript进行限制。 ```javascript function test() { if (document.a.b.value.length &gt; 50) { alert("不能超过 50 个字符!"); document.a.b.focus(); return ...

    JavaScript常用验证函数实例汇总

    本文实例汇总了JavaScript常用验证函数。分享给大家供大家参考。具体汇总如下: 一、字符串类验证 1. 长度限制 代码如下:[removed] function test() { if(document.a.b.value.length&gt;50) { alert&#40;“不能超过50...

Global site tag (gtag.js) - Google Analytics