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的对话框详解与参数
Mar 08 Javascript
JavaScript中的View-Model使用介绍
Aug 11 Javascript
基于jquery中children()与find()的区别介绍
Apr 26 Javascript
js数组常见操作及数组与字符串相互转化实例详解
Nov 10 Javascript
基于JavaScript实现类名的添加与移除
Apr 23 Javascript
vue.js动态数据绑定学习笔记
May 19 Javascript
React 实现拖拽功能的示例代码
Jan 06 Javascript
使用VueRouter的addRoutes方法实现动态添加用户的权限路由
Jun 03 Javascript
Vue实现附件上传功能
May 28 Javascript
ES6 Symbol在对象中的作用实例分析
Jun 06 Javascript
vue实现div可拖动位置也可改变盒子大小的原理
Sep 16 Javascript
如何用vue实现网页截图你知道吗
Nov 17 Vue.js
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
全国FM电台频率大全 - 16 河南省
2020/03/11 无线电
PHP的运行机制与原理(底层)
2015/11/16 PHP
使用phpstorm和xdebug实现远程调试的方法
2015/12/29 PHP
PHP中创建和编辑Excel表格的方法
2018/09/13 PHP
js 页面刷新location.reload和location.replace的区别小结
2009/12/24 Javascript
js下用层来实现select的title提示属性
2010/02/23 Javascript
解决Extjs4中form表单提交后无法进入success函数问题
2013/11/26 Javascript
jquery ajax应用中iframe自适应高度问题解决方法
2014/04/12 Javascript
jQuery+ajax实现无刷新级联菜单示例
2015/05/21 Javascript
分享有关jQuery中animate、slide、fade等动画的连续触发、滞后反复执行的bug
2016/01/10 Javascript
jQuery实用小技巧_输入框文字获取和失去焦点的简单实例
2016/08/25 Javascript
JavaScript 链式结构序列化详解
2016/09/30 Javascript
原生js实现手风琴功能(支持横纵向调用)
2017/01/13 Javascript
使用Node.js实现RESTful API的示例
2017/08/01 Javascript
JavaScript html5 canvas实现图片上画超链接
2017/10/20 Javascript
利用原生的JavaScript实现简单拼图游戏
2018/11/18 Javascript
jQuery 同时获取多个标签的指定内容并储存为数组
2018/11/20 jQuery
实例介绍JavaScript中多种组合继承
2019/01/20 Javascript
Vue3 中的数据侦测的实现
2019/10/09 Javascript
vue npm install 安装某个指定的版本操作
2020/08/11 Javascript
python使用socket进行简单网络连接的方法
2015/04/29 Python
python常见的格式化输出小结
2016/12/15 Python
pytorch加载自定义网络权重的实现
2020/01/07 Python
python根据字典的键来删除元素的方法
2020/08/16 Python
加拿大百叶窗和窗帘定制网站:Blinds
2017/01/30 全球购物
friso美素佳儿官方海外旗舰店:荷兰原产原罐
2017/07/03 全球购物
Whittard官方海外旗舰店:英国百年茶叶品牌
2018/02/22 全球购物
Laura Geller官网:美国彩妆品牌
2018/12/29 全球购物
Dower & Hall官网:英国小众轻奢珠宝品牌
2019/01/31 全球购物
咖啡店创业计划书
2014/08/15 职场文书
新教师个人工作总结
2015/02/06 职场文书
音乐研修感悟
2015/11/18 职场文书
《夸父追日》教学反思
2016/02/20 职场文书
goland 设置project gopath的操作
2021/05/06 Golang
logback 实现给变量指定默认值
2021/08/30 Java/Android
漫改真人电影「萌系男友是燃燃的橘色」公开先导视觉图
2022/03/21 日漫