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 相关文章推荐
jquery imgareaselect 使用利用js与程序结合实现图片剪切
Jul 30 Javascript
关于COOKIE个数与大小的问题
Jan 17 Javascript
怎么清空javascript数组
May 11 Javascript
JavaScript自动设置IFrame高度的小例子
Jun 08 Javascript
jquery根据name属性查找的小例子
Nov 21 Javascript
Node.js中安全调用系统命令的方法(避免注入安全漏洞)
Dec 05 Javascript
jquery删除指定子元素代码实例
Jan 13 Javascript
JavaScript的ExtJS框架中表格的编写教程
May 21 Javascript
Node.js读取文件内容示例
Mar 07 Javascript
angularjs实现上拉加载和下拉刷新数据功能
Jun 12 Javascript
详解vue模拟加载更多功能(数据追加)
Jun 23 Javascript
anime.js 实现带有描边动画效果的复选框(推荐)
Dec 24 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数据饼图效果实现代码
2011/11/23 PHP
php中使用PHPExcel读写excel(xls)文件的方法
2014/09/15 PHP
C#静态方法与非静态方法实例分析
2014/09/22 PHP
PHP实现通用alert函数的方法
2015/03/11 PHP
php传值赋值和传地址赋值用法实例分析
2015/06/20 PHP
PHP 计算至少是其他数字两倍的最大数的实现代码
2020/05/26 PHP
laravel admin实现分类树/模型树的示例代码
2020/06/10 PHP
一个很简单的办法实现TD的加亮效果.
2006/06/29 Javascript
Javascript----文件操作
2007/01/18 Javascript
javascript 写类方式之八
2009/07/05 Javascript
JS去除字符串两端空格的简单实例
2013/12/27 Javascript
javascript操作excel生成报表全攻略
2014/05/04 Javascript
jquery实现对联广告的方法
2015/02/05 Javascript
jQuery实现的网页右下角tab样式在线客服效果代码
2015/10/23 Javascript
javascript 数组的正态分布排序的问题
2016/07/31 Javascript
使用vue与jquery实时监听用户输入状态的操作代码
2017/09/19 jQuery
vue keep-alive请求数据的方法示例
2018/05/16 Javascript
vue里面使用mui的弹出日期选择插件实例
2018/09/16 Javascript
详解async/await 异步应用的常用场景
2019/05/13 Javascript
前端路由&amp;webpack基础配置详解
2019/06/10 Javascript
layui+SSM的数据表的增删改实例(利用弹框添加、修改)
2019/09/27 Javascript
[01:28:43]2014 DOTA2华西杯精英邀请赛5 24 DK VS CIS
2014/05/25 DOTA
python实现可将字符转换成大写的tcp服务器实例
2015/04/29 Python
python列表生成式与列表生成器的使用
2018/02/23 Python
python控制windows剪贴板,向剪贴板中写入图片的实例
2018/05/31 Python
python 常见字符串与函数的用法详解
2018/11/23 Python
pyqt5实现登录界面的模板
2020/05/30 Python
python自动化之Ansible的安装教程
2019/06/13 Python
详解PyTorch中Tensor的高阶操作
2019/08/18 Python
在pycharm中使用matplotlib.pyplot 绘图时报错的解决
2020/06/01 Python
python中类与对象之间的关系详解
2020/12/16 Python
荷兰家电购物网站:Expert.nl
2020/01/18 全球购物
模具设计与制造专业推荐信
2014/02/16 职场文书
领导调研接待方案
2014/02/27 职场文书
少年派的奇幻漂流观后感
2015/06/08 职场文书
2016小学优秀教师先进事迹材料
2016/02/26 职场文书