转: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>
分享到:
相关推荐
总结来说,通过这段代码,我们可以学习到如何使用JavaScript来实现`textarea`光标的动态定位,这对于提升用户在多行文本编辑场景下的交互体验具有重要意义。同时,了解不同浏览器对光标操作的支持差异也是前端开发者...
<textarea v-auto-focus></textarea> ``` 这样,每当这些元素被渲染到页面上时,就会自动获得焦点。但是,有时候我们可能不希望所有情况下都自动聚焦,这时可以传递参数给自定义指令,根据参数决定是否聚焦: ```...
本文将详细介绍如何使用JavaScript在`textarea`的光标位置插入文本。该方法适用于多种浏览器环境,包括Internet Explorer(IE)和其他基于Mozilla的浏览器(如Firefox)。我们将通过分析提供的代码示例来深入理解其...
总结起来,JavaScript 的 textarea 光标定位涉及到 `setSelectionRange` 和 `createTextRange` 这两种方法,通过条件判断实现跨浏览器兼容性。理解和掌握这些方法,可以帮助开发者在各种浏览器环境中提供一致的用户...
在聊天、论坛或者博客评论等应用场景中,用户可能需要在输入的文字中插入特定的字符,比如表情符号,而这些字符需要被精确地定位到用户当前的光标位置。为此,我们需要编写一个jQuery扩展方法来实现这一功能。 1. *...
在IT领域,特别是前端开发中,使用JavaScript在`textarea`元素的光标位置插入内容是一项常见且实用的技术。本文将详细解析如何实现这一功能,并深入理解其背后的逻辑与原理。 ### 核心知识点:在`textarea`光标处...
以下是一个基本的JavaScript函数,它会在用户按下回车键时,使`textarea`重新获取焦点: ```javascript document.getElementById('myTextarea').addEventListener('keyup', function(event) { if (event.keyCode =...
在javascript代码中,我们首先获取了TEXTAREA元素的引用,并将其focus设置为true,这样可以确保文本框获取了焦点。然后,我们使用document.selection.createRange()方法创建了一个范围对象,这个对象可以帮助我们...
在JavaScript中,操作文本输入域,如`<textarea>`,涉及到光标位置的处理时,通常需要使用到浏览器提供的API。对于不同的浏览器,这些API可能会有所差异。在处理`<textarea>`光标位置插入文字并移动光标到文字末尾的...
这个功能可以通过JavaScript来实现,正如标题“Textarea根据内容自适应高度”所描述的那样。本文将详细介绍如何使用JavaScript来控制`Textarea`的内容自适应高度,并提供相关代码示例。 首先,我们来看一下提供的...
而在`validateInput`函数中,我们传入一个验证函数(如检查用户名是否为空),如果验证失败,则弹出警告并重新聚焦到该输入框。 对于密码输入,我们可能需要更复杂的验证规则,比如确认密码是否匹配。这可以通过...
本文主要介绍如何使用jQuery在textarea元素中光标所在位置插入文本的技术,涉及到的操作和概念包括jQuery库的使用、文本框(textarea)的光标定位与操作、JavaScript中的字符串操作等。文章首先定义了jQuery的扩展...
在JavaScript中,复制内容到剪贴板的操作是前端开发中常见的功能,比如用户在网页上点击复制按钮将文本信息快速存入系统粘贴板。在本文中,我们将深入探讨如何利用JavaScript实现这一功能,以及涉及的安全问题。 ...
这个函数会在提交表单时检查textarea的值,如果长度超过50,会弹出警告并阻止表单提交。 2. 只能输入汉字:如果需要限制输入框只允许输入汉字,可以利用正则表达式进行替换: ```html (/[^\u4E00-\u9FA5]/g, '')"> ...
2. 事件监听:利用`addEventListener`方法监听用户操作,如`'submit'`、`'change'`、`'focus'`和`'blur'`,在事件触发时执行验证函数。 3. 正则表达式:JavaScript的`test()`或`match()`方法可以配合正则表达式进行...
在JavaScript中,有时我们需要在textarea元素的光标位置插入文本,比如实现一个简单的富文本编辑器功能。这个小例子展示了如何使用JavaScript实现这个功能。在HTML文档中,我们可以通过监听用户的交互事件,如点击...
当用户在文本框中输入超过指定长度时,通过JavaScript进行限制。 ```javascript function test() { if (document.a.b.value.length > 50) { alert("不能超过 50 个字符!"); document.a.b.focus(); return ...
本文实例汇总了JavaScript常用验证函数。分享给大家供大家参考。具体汇总如下: 一、字符串类验证 1. 长度限制 代码如下:[removed] function test() { if(document.a.b.value.length>50) { alert(“不能超过50...