在textarea和input光标处插入内容,支持ie基础知识_光标小白知识

项目需求,用户要能够输入和点击外面的公式去插入到textaera中,试了好几种方法,有的是在谷歌下好使,在ie下不好使,最后找到了下面这个方法,目前在ie8以上都可以生效。直接上代码 function insertAtCursor(myField, myValue) {//IE supportif (document.selection) {myField

在textarea和input光标处插入内容,支持ie基础知识

项目需求,用户要能够输入和点击外面的公式去插入到textaera中,试了好几种方法,有的是在谷歌下好使,在ie下不好使,最后找到了下面这个方法,目前在ie8以上都可以生效。直接上代码  

在textarea和input光标处插入内容,支持ie基础知识_光标小白知识

function insertAtCursor(myField, myValue) {
        //IE support
        if (document.selection) {
            myField.focus();
            sel = document.selection.createRange();
            sel.text = myValue;
        }
        //MOZILLA and others
        else if (myField.selectionStart || myField.selectionStart == '0') {
            var startPos = myField.selectionStart;
            var endPos = myField.selectionEnd;
            myField.value = myField.value.substring(0, startPos)
                    + myValue
                    + myField.value.substring(endPos, myField.value.length);
            myField.selectionStart = startPos + myValue.length;
            myField.selectionEnd = startPos + myValue.length;
        } else {
            myField.value += myValue;
        }
    }

调用也相当的简单

insertAtCursor(‘DOM节点’,‘内容’);
海计划公众号
(1)
上一篇 2020/03/23 08:58
下一篇 2020/03/23 08:58

您可能感兴趣的内容

  • DropIt基础知识入门_一个用nodejs构建的文件上传器

    DropIt基础知识入门 官方网址:http://dropit.thal.tech/ GitHub:https://github.com/ThalKod/DropIt 简介描述:一…

    2020/03/11
  • js判断pc端和手机端入门知识_移动端菜鸟教程

    js判断是否为移动端代码,获取用户userAgent代理头的值,进行匹配判断,如果匹配到就进行跳转到移动端。一、查看当前代理头信息console.log(“用户代理: ” + navigator.userAgent);
    在浏览器中按F12进入调试模式,查看请求。二、匹配跳转代码1、第一种: var is_m

    2020/03/20
  • 实现网教程视频_按需雇佣 BAT 工程师、设计师

    实现网教程视频 官方网址:https://shixian.com/ 简介描述:按需雇佣 BAT 工程师、设计师 实现网为企业提供BAT等名企背景的、靠谱的开发设计兼职人才和自由职业…

    2020/03/06
  • 有趣的Js格式转换小白指南_格式菜鸟攻略

    Blob使用 input 获取文件时,你拿到的就是 file 对象,而 file 继承于 blob,所以直接讲比较陌生的 blob 吧。BLOB (binary large object),二进制大对象,

    2020/03/26
  • sass和less的优缺点菜鸟教程_sass小白攻略

    简述sass和less都是css的预编译处理语言,他们引入了mixins,参数,嵌套规则,运算,颜色,名字空间,作用域,JavaScript赋值等 加快了css开发效率,当然这两者都可以配合gulp和grunt等前端构建工具使用sass和less主要区别:在于实现方式 less是基于JavaScript的在客户端处理,引入less.js就可以处理,sass是

    2020/03/30
  • Vue前端鉴权方案,前后端分离教程视频_方案小白知识

    技术栈前端Vue全家桶,后台.net。需求分析前端路由鉴权,屏蔽地址栏入侵路由数据由后台管理,前端只按固定规则异步加载路由权限控制精确到每一个按钮自动更新token同一个浏览器只能登录一个账号前端方案对于需求1、2、3,采用异步加载路由方案首先编写vue全局路由守卫排除登录路由和无需鉴权路由登录后请求拉取用户菜单数据在vuex里处理菜单和路由匹配数据将在vu

    2020/03/20
  • TypeScript 2.0 标记联合类型菜鸟攻略_类型入门基础教程

    TypeScript 2.0 实现了一个相当有用的功能:标记联合类型,您可能将其称为 sum 类型或与其他编程语言区别开的联合类型。 标记联合类型是其成员类型都定义了字面量类型的区分属性的联合类型。上面的讲的是理论性的,来几个例子看看更贴切。使用标记的联合类型构建付款方式假设咱们为系统用户可以选择的以下支付方式建模Cash (现金)PayPal 与给定的电子

    2020/03/23
  • BFC的作用及其应用入门基础教程_应用菜鸟攻略

    BFC就是块级格式化上下文,是页面盒模型布局中的一种 CSS 渲染模式,相当于一个独立的容器,里面的元素和外部的元素相互不影响。 创建 BFC 的方式有:  1.html的根元素  2.float浮动  3.绝对定位  4.overflow不为 visible  5.display为表格布局或弹性布局  6.contain值为layout  7.conten

    2020/03/24
  • BearCss使用指南是一个免费的Web应用程序

    BearCss指南攻略 官方网址:http://bearcss.com/ 简介描述:是一个免费的Web应用程序 BearCss是一个免费的Web应用程序,需要你上传一份HTML文档…

    2020/03/06
  • cordova小白常识使用HTML, CSS & JS进行移动App开发,多平台共用一套代码

    cordova使用帮助 官方网址:http://cordova.axuer.com/ 简介描述:使用HTML, CSS & JS进行移动App开发,多平台共用一套代…

    2020/03/06
  • 页面性能优化-原生JS实现图片懒加载使用攻略_加载小白知识

    在项目开发中,我们往往会遇到一个页面需要加载很多图片的情况。我们可以一次性加载全部的图片,但是考虑到用户有可能只浏览部分图片。所以我们需要对图片加载进行优化,只加载浏览器窗口内的图片,当用户滚动时,再加载更多的图片。这种加载图片的方式叫做图片懒加载,又叫做按需加载或图片的延时加载。这样做的好处是:1.可以加快页面首屏渲染的速度;2.节约用户的流量。一.实现思

    2020/03/30
  • js 实现二级联动菜鸟攻略_方法小白基础

    在web开发中我们经常会遇到页面的一个二级联动技术,二级联动字面解释就是说我在选择一级select不同的option,下面的二级option的属性值在进行相应的变化。onchange 事件山东<op

    2020/03/31
  • pieces.js教程视频一款效果非常炫酷的js碎片化图片轮播切换特效插件

    pieces.js基础入门 官方网址:https://tympanus.net/codrops/2018/02/21/animated-fragment-slideshow/ Gi…

    2020/03/05
  • 实现一个JS深拷贝函数基础知识入门_函数入门基础教程

    JS深拷贝概念并不新鲜,但是真正要真正理解原理还是有点难度的。这也是JS语言精粹之一吧。例子let a = {name: ‘demo’,age: 18
    };let b = a;
    b.name = ‘demo1’;console.log(a); // 输出 {name: “demo1”, age: 18}
    console.log(b); // 输出 {name

    2020/03/29
  • Js二维码插件:qrious指南攻略_插件小白教程

    什么是二维码二维码又称QR Code,QR全称Quick Response,是一个近几年来移动设备上超流行的一种编码方式,它比传统的Bar Code条形码能存更多的信息,也能表示更多的数据类型。二维条码/二维码(2-dimensional bar code)是用某种特定的几何图形按一定规律在平面(二维方向上)分布的黑白相间的图形记录数据符号信息的;在代码编制

    2020/03/26
  • 如何优化css expression性能?基础入门_性能小白基础

    IE 浏览器中 CSS Expression 特性的最大的问题:会反复执行,每秒钟可能执行了成百上千次,有严重的性能问题。如何对 CSS Expression 进行优化呢?至少:如果我们将 CSS Expression 在匹配的元素中仅执行一次,性能将会提升很大。old9 在 《CSS Expression Reloaded》一文中提供了一个解决方案:在 C

    2020/03/20