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 For Beginners(转载)
Jan 05 Javascript
用jquery ajax获取网站Alexa排名的代码
Dec 12 Javascript
10分钟学会写Jquery插件实例教程
Sep 06 Javascript
Vue.JS入门教程之事件监听
Dec 01 Javascript
老生常谈的跨域处理
Jan 11 Javascript
微信小程序 滚动到某个位置添加class效果实现代码
Apr 19 Javascript
react native带索引的城市列表组件的实例代码
Aug 08 Javascript
详解node单线程实现高并发原理与node异步I/O
Sep 21 Javascript
vue2导航根据路由传值,而改变导航内容的实例
Nov 10 Javascript
jQuery进阶实践之利用最优雅的方式如何写ajax请求
Dec 20 jQuery
微信小程序开发技巧汇总
Jul 15 Javascript
JavaScript多种滤镜算法实现代码实例
Dec 10 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验证邮箱和ip地址最简单方法汇总
2015/10/30 PHP
PHP封装cURL工具类与应用示例
2019/07/01 PHP
Yii2.0框架behaviors方法使用实例分析
2019/09/30 PHP
PHP8.0新功能之Match表达式的使用
2020/07/19 PHP
jquery插件制作 提示框插件实现代码
2012/08/17 Javascript
javascript里模拟sleep(两种实现方式)
2013/01/25 Javascript
JQuery入门——事件切换之hover()方法应用介绍
2013/02/05 Javascript
javascript禁制后退键(Backspace)实例代码
2013/11/15 Javascript
JavaScript函数的4种调用方法详解
2014/04/22 Javascript
ExpressJS入门实例
2015/01/14 Javascript
javascript中Array()数组函数详解
2015/08/23 Javascript
学习使用grunt来打包JavaScript和CSS程序的教程
2016/01/04 Javascript
理解javascript定时器中的单线程
2016/02/23 Javascript
Nodejs中的this详解
2016/03/26 NodeJs
JS实现改变HTML上文字颜色和内容的方法
2016/12/30 Javascript
分享一道关于闭包、bind和this的面试题
2017/02/20 Javascript
jQuery实现jQuery-form.js实现异步上传文件
2017/04/28 jQuery
AngularJS日程表案例详解
2017/08/15 Javascript
JavaScript屏蔽Backspace键的实现代码
2017/11/02 Javascript
Vue项目环境搭建详细总结
2019/09/26 Javascript
微信小程序返回上一页传参并刷新过程解析
2019/12/13 Javascript
ES6实现图片切换特效代码
2020/01/14 Javascript
vue+elementUI实现简单日历功能
2020/09/24 Javascript
tensorflow 使用flags定义命令行参数的方法
2018/04/23 Python
Python机器学习之scikit-learn库中KNN算法的封装与使用方法
2018/12/14 Python
关于box-sizing的全面理解
2016/07/28 HTML / CSS
详解CSS3原生支持div铺满浏览器的方法
2018/08/30 HTML / CSS
行政经理的岗位职责
2013/11/23 职场文书
派出所班子党的群众路线对照检查材料思想汇报
2014/10/01 职场文书
反对四风自我剖析材料
2014/10/07 职场文书
2014年业务工作总结
2014/11/17 职场文书
医院病假条怎么写
2015/08/17 职场文书
个人工作总结怎么写?
2019/04/09 职场文书
python读取mnist数据集方法案例详解
2021/09/04 Python
详解redis在微服务领域的贡献
2021/10/16 Redis
特别篇动画《总之就是非常可爱 ~制服~》PV公开,2022年夏季播出
2022/04/04 日漫