js操作输入框中选择内容兼容IE及其他主流浏览器


Posted in Javascript onApril 22, 2014

工作中遇到需要给输入框中选中的内容增加超链接

function addHref(des){ 
var selectedText=""; 
if(window.getSelection&&des != undefined){//兼容非IE浏览器,由于非IE浏览器需要给定操作的元素ID才可以获取输入元素中选中的内容,因此需要输入ID var textField=document.getElementById(des); 
var selectionStart=textField.selectionStart; 
var selectionEnd=textField.selectionEnd; 
if(selectionStart != undefined && selectionEnd != undefined){ 
selectedText=textField.value.substring(selectionStart,selectionEnd); 
} 
if(selectedText==""){ 
alert("请选择需要添加链接的文字!"); 
return; 
} 
var hyperlinks=prompt("超链接地址:",""); 
if(hyperlinks!=null){ 
var replaceString="<a href='"+hyperlinks+"' target='_blank'><b><u><font color='#686600'>" + selectedText + "</font></u></b></a>"; 
tmpStr=textField.value; 
textField.value=tmpStr.substring(0,selectionStart)+replaceString+tmpStr.substring(selectionEnd,tmpStr.length); 
} 
} 
else if((document.selection)&&(document.selection.type == "Text")){//IE中不需要ID 
var range=document.selection.createRange(); 
var formerElement=range.parentElement(); 
if(formerElement.tagName!="TEXTAREA"){ 
alert("请在指定位置选择需要添加超链接的文字!"); 
return; 
} 
selectedText=range.text; 
var hyperlinks=prompt("超链接地址:",""); 
if(hyperlinks!=null){ 
range.text="<a href='"+hyperlinks+"' target='_blank'><b><u><font color='#686600'>" + selectedText + "</font></u></b></a>"; 
} 
} 
else{ 
alert("请选择需要添加链接的文字!"); 
return; 
} 
}
Javascript 相关文章推荐
javascript document.images实例
May 27 Javascript
原生Javascript封装的一个AJAX函数分享
Oct 11 Javascript
原生javascript实现获取指定元素下所有后代元素的方法
Oct 28 Javascript
JavaScript通过function定义对象并给对象添加toString()方法实例分析
Mar 23 Javascript
JavaScript获取一个范围内日期的方法
Apr 24 Javascript
百度坐标(BD09)、国测局坐标(火星坐标,GCJ02)、和WGS84坐标系之间的转换
Feb 19 Javascript
vue实现单选和多选功能
Aug 11 Javascript
ECMAscript 变量作用域总结概括
Aug 18 Javascript
vue-cli与webpack处理静态资源的方法及webpack打包的坑
May 15 Javascript
vue引用js文件的多种方式(推荐)
May 17 Javascript
Vue源码中要const _toStr = Object.prototype.toString的原因分析
Dec 09 Javascript
Nuxt.js实现一个SSR的前端博客的示例代码
Sep 06 Javascript
jquery分页插件jpaginate在IE中不兼容问题
Apr 22 #Javascript
jquery防止重复执行动画避免页面混乱
Apr 22 #Javascript
Area 区域实现post提交数据的js写法
Apr 22 #Javascript
div失去焦点事件实现思路
Apr 22 #Javascript
js隐式全局变量造成的bug示例代码
Apr 22 #Javascript
JavaScript实现的图像模糊算法代码分享
Apr 22 #Javascript
JavaScript闭包实例讲解
Apr 22 #Javascript
You might like
使用PHP获取网络文件的实现代码
2010/01/01 PHP
php获取bing每日壁纸示例分享
2014/02/25 PHP
基础的WordPress插件制作教程
2015/11/24 PHP
php实现的debug log日志操作类实例
2016/07/12 PHP
PHP 99乘法表的几种实现代码
2020/10/13 PHP
Javascript的闭包
2009/12/31 Javascript
javascript实现的基于金山词霸网络翻译的代码
2010/01/15 Javascript
jquery交替变换颜色的三种方法 实例代码
2013/11/19 Javascript
Backbone.js的Hello World程序实例
2015/06/19 Javascript
js实现当复选框选择匿名登录时隐藏登录框效果
2015/08/14 Javascript
微信小程序 教程之wxapp 视图容器 view
2016/10/19 Javascript
jquery文字填写自动高度的实现方法
2016/11/07 Javascript
JavaScript 详解预编译原理
2017/01/22 Javascript
从零学习node.js之简易的网络爬虫(四)
2017/02/22 Javascript
js实现功能比较全面的全选和多选
2017/03/02 Javascript
利用types增强vscode中js代码提示功能详解
2017/07/07 Javascript
详解webpack + vue + node 打造单页面(入门篇)
2017/09/23 Javascript
js数据类型检测总结
2018/08/05 Javascript
详解vscode中vue代码颜色插件
2018/10/11 Javascript
微信小程序实现留言功能
2018/10/31 Javascript
Vue起步(无cli)的啊教程详解
2019/04/11 Javascript
Vue2.0使用嵌套路由实现页面内容切换/公用一级菜单控制页面内容切换(推荐)
2019/05/08 Javascript
bootstrap datepicker的基本使用教程
2019/07/09 Javascript
python3实现UDP协议的服务器和客户端
2017/06/14 Python
关于Python数据结构中字典的心得
2017/12/04 Python
Django 后台获取文件列表 InMemoryUploadedFile的例子
2019/08/07 Python
Python实现直方图均衡基本原理解析
2019/08/08 Python
Python简易版停车管理系统
2019/08/12 Python
Python 、Pycharm、Anaconda三者的区别与联系、安装过程及注意事项
2019/10/11 Python
Python如何省略括号方法详解
2020/03/21 Python
tensorflow2.0的函数签名与图结构(推荐)
2020/04/28 Python
html5响应式开发自动计算fontSize的方法
2020/01/13 HTML / CSS
韩国著名的在线综合购物网站:Akmall
2016/08/07 全球购物
意大利奢侈品牌在线精品店:Jole.it
2020/11/23 全球购物
优秀班集体事迹材料
2014/12/25 职场文书
springboot 全局异常处理和统一响应对象的处理方式
2022/06/28 Java/Android