`
cwy534363081
  • 浏览: 7411 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

[转] 修复textarea的focus()时的光标位置

 
阅读更多

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>textarea的focus修复</title>
<style type="text/css">
  p {
    background-color:#F7F9FA;
    border:1px dashed #8CACBB;
    padding:5px;
    line-height:1.5em;
  }
</style>
<script type="text/javascript" src="./yahoo-dom-event.js"></script>
</head> 

<body>
<p>测试情景:对已有内容的textarea执行focus()<br />
  测试结果:只有Firefox(gecko内核)能将光标定位在文本最后</p>
<textarea name="" cols="50" rows="10" id="textarea">预置内容预置内容</textarea><br />
<label> 
    <input type="submit" name="button" id="button" value="focus修复"    /> 
</label>

<script type="text/javascript"> 
  var textarea = document.getElementById("textarea"),
    button = document.getElementById("button");
  textarea.focus();
  button.onclick = function(){
    if(YAHOO.env.ua.ie){
      var rng = textarea.createTextRange();
      rng.text = textarea.value;
      rng.select();
      rng.collapse(false);
    }else if (YAHOO.env.ua.webkit){
      textarea.select();
      window.getSelection().collapseToEnd();
    }else{
      textarea.focus();
    }
  };
</script>
</body> 
</html>
 
分享到:
评论

相关推荐

    jQuery获取设置textarea中光标位置

    jQuery扩展函数,用于获取设置textarea中光标位置

    vue获取textarea的光标位置.js

    vue通过当前的光标来进行插值,从而需要去获取光标所在的位置然后进行对光标前后的字符串进行截取处理,从而达到对新字符的插入

    JavaScript获取,设置光标位置,兼容InputTextArea

    在JavaScript编程中,获取和设置光标位置是常见的需求,特别是在与用户交互的表单元素如`&lt;input&gt;`和`&lt;textarea&gt;`中。这涉及到DOM(文档对象模型)操作和事件处理,对于创建动态和响应式的网页应用至关重要。本文将...

    在textarea光标处插入文本

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

    Textarea在光标停留处插入文字

    当事件触发时,获取用户输入的新文本,并在光标位置插入。以下是基于`input`事件的一个简单示例: ```javascript textarea.addEventListener('input', function() { var value = textarea.value; var cursorPos =...

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

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

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

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

    用javascript获取textarea中的光标位置

    对于写javascript写网页编辑器的人来说,获取textarea中的光标位置是一个非常重要的问题,而往往很多人在这个地方不知所措,找不到好的办法。昨天我在网上找到了一段javascript代码,本来不想把原版放在这里的,就是...

    textarea光标定位在最后

    textarea光标定位在最后,就是往textarea中赋值时候,光标自动移到最后。

    javascript获得光标所在的文本框(text textarea)中的位置.docx

    在前端开发中,经常需要处理用户在文本框(如`&lt;input type="text"&gt;`或`&lt;textarea&gt;`)内的输入行为,例如实现自动填充、实时校验等功能时,获取光标的位置就显得尤为重要。本文将详细介绍如何使用JavaScript来实现这...

    jQuery.curpos.js插件获textarea输入框下光标的位置.zip

    在网页开发中,与用户交互的表单元素如textarea常常需要细致的控制,例如获取或设置光标位置,这在实现某些特定功能时是必不可少的。jQuery作为一款广泛使用的JavaScript库,提供了丰富的API来简化这一过程。今天...

    jQuery.curpos.js插件获textarea输入框下光标的位置

    记得做前端这一块,很多时候需要判断textarea输入框下的光标位置 比如要在输入的文档中插入一些表情符号,图片之类的,这个时候在插入文字之前, 就需要先判断光标的位置了。今天就特意给大家推荐这样一个小...

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

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

    textarea中的光标停留处插上文字

    目的通过点击页面上的按钮button 在textarea中的光标停留处插上文字

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

    1. **焦点光标位置**:当用户在文本框中输入时,光标所在的位置就是焦点位置。这可以帮助我们判断用户当前正在输入的位置,以便进行相应的处理。 2. **选中起始位置**:这是用户选择的文本块的起始字符位置。例如,...

    获取div编辑框,textarea,input text的光标位置 兼容IE,FF和Chrome的方法介绍

    获取光标位置时,需要使用window.getSelection()方法,然后定位到anchorNode的父节点,进而判断出是哪个元素。 需要注意的是,代码中包含了一些自定义的方法,比如String.prototype.trim,这是一个用于去除字符串两...

    jQueryCursorPlugIn.js textArea文本光标全功能插件

    jQuery textArea文本光标全功能插件,可以获取光标位置,向光标文字插入文本,高亮显示指定的文本块

    Javascript 获取光标位置

    对于`&lt;input&gt;`和`&lt;textarea&gt;`这样的文本输入元素,可以使用`selectionStart`和`selectionEnd`属性来获取光标的位置。这两个属性分别表示选区的起始和结束位置,如果没有选区,则返回光标的位置。例如,要获取`...

    jquery 确定光标位置

    在HTML的可编辑元素(如`&lt;input&gt;`、`&lt;textarea&gt;`)中,光标位置表示用户正在输入或编辑文字的地方。通过JavaScript,我们可以获取或设置这个位置,从而实现更复杂的用户交互。 在jQuery中,没有直接的方法来获取或...

Global site tag (gtag.js) - Google Analytics