js实现鼠标点击文本框自动选中内容的方法


Posted in Javascript onAugust 20, 2015

本文实例讲述了js实现鼠标点击文本框自动选中内容的方法。分享给大家供大家参考。具体如下:

这里使用JS实现鼠标点击时自动选中文本框文本的效果,相信许多朋友都遇到这种功能的,就是当我们点击文本框的时候,文本框中默认的文字会被全部选中,这样当你输入的时候不用再去选择,省去了一些麻烦,提高了输入效率,用户肯定会喜欢这功能,那么实现的方法是怎么样呢?通过本代码你就搞明白了。

先来看看运行效果截图:

js实现鼠标点击文本框自动选中内容的方法

在线演示地址如下:

具体代码如下:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>自动选择文本框/编辑框中的文字</title>
<script type="text/javascript">
function Myselect_txt(){
 if (document.form1.title.focus){
 document.form1.title.select();}
}
function Myselect_txtarea(){
 if (document.form1.content.focus){
 document.form1.content.select();}
}
</script>
</head>
<body style="font-size:12px">
<table width="443" height="97" border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="#f9f9f9">
 <form name="form1">
 <tr bgcolor="#214994">
  <td height="25" colspan="2"><div align="center"><font color="#FFFFFF">新闻信息修改</font></div></td>
 </tr>
 <tr>
  <td width="80" height="28"><div align="right"><font color="#214994">新闻标题:</font></div></td>
  <td width="363"><input name="title" type="text" size="50" value="今日新闻头条" onClick="Myselect_txt()"></td>
 </tr>
 <tr>
  <td height="20"><div align="right"><font color="#214994">新闻内容:</font></div></td>
  <td rowspan="2"><textarea name="content" cols="50" rows="6" onClick="Myselect_txtarea()">今日,据相关方面报道,...</textarea></td>
 </tr>
 <tr>
  <td height="10"> </td>
 </tr>
 <tr>
  <td height="32" colspan="2">
  <div align="center">
   <input name="add" type="submit" id="add" value="添加">
 
   <input name="Submit" type="reset" value="重置">
  </div></td>
 </tr>
 </form>
</table>
</body>
</html>

希望本文所述对大家的javascript程序设计有所帮助。

Javascript 相关文章推荐
JQuery Tips(4) 一些关于提高JQuery性能的Tips
Dec 19 Javascript
扩展jQuery对象时如何扩展成员变量具体怎么实现
Apr 25 Javascript
基于jQuery插件实现环形图标菜单旋转切换特效
May 15 Javascript
JS实现自动切换文字的导航效果代码
Aug 27 Javascript
jquery实现点击其他区域时隐藏下拉div和遮罩层的方法
Dec 23 Javascript
Bootstrap实现默认导航栏效果
Sep 21 Javascript
JavaScript进阶练习及简单实例分析
Jun 03 Javascript
layui实现动态和静态分页
Apr 28 Javascript
Vue-cli3简单使用(图文步骤)
Apr 30 Javascript
如何用原生js写一个弹窗消息提醒插件
May 24 Javascript
node中使用log4js4.x版本记录日志的方法
Aug 20 Javascript
vue-cil之axios的二次封装与proxy反向代理使用说明
Apr 07 Vue.js
js实现文字在按钮上滚动的方法
Aug 20 #Javascript
jquery实现漫天雪花飞舞的圣诞祝福雪花效果代码分享
Aug 20 #Javascript
js实现网页多级级联菜单代码
Aug 20 #Javascript
javascript常用的方法整理
Aug 20 #Javascript
JS实现的Select三级下拉菜单代码
Aug 20 #Javascript
遮罩层点击按钮弹出并且具有拖动和关闭效果(两种方法)
Aug 20 #Javascript
JS实现支持多选的遍历下拉列表代码
Aug 20 #Javascript
You might like
PHP学习笔记 用户注册模块用户类以及验证码类
2011/09/20 PHP
随机显示经典句子或诗歌的javascript脚本
2007/08/04 Javascript
JQuery 控制内容长度超出规定长度显示省略号
2014/05/23 Javascript
js和jquery设置disabled属性为true使按钮失效
2014/08/07 Javascript
Javascript表单验证要注意的事项
2014/09/29 Javascript
JavaScript使用循环和分割来替换和删除元素实例
2014/10/13 Javascript
javascript中setTimeout和setInterval的unref()和ref()用法示例
2014/11/26 Javascript
js面向对象实现canvas制作彩虹球喷枪效果
2016/09/24 Javascript
JavaScript常用正则验证函数实例小结【年龄,数字,Email,手机,URL,日期等】
2017/01/23 Javascript
javascript实现的图片预览功能
2017/03/25 Javascript
ionic App问题总结系列之ionic点击系统返回键退出App
2017/08/19 Javascript
基于ES6 Array.of的用法(实例讲解)
2017/09/05 Javascript
vue2.0 和 animate.css的结合使用
2017/12/12 Javascript
详解基于vue-cli配置移动端自适应
2018/01/13 Javascript
老生常谈JavaScript获取CSS样式的方法(兼容各浏览器)
2018/09/19 Javascript
深入理解基于vue-cli的webpack打包优化实践及探索
2019/10/14 Javascript
vue+elementUI动态生成面包屑导航教程
2019/11/04 Javascript
python list元素为tuple时的排序方法
2018/04/18 Python
Python使用itertools模块实现排列组合功能示例
2018/07/02 Python
使用python打印十行杨辉三角过程详解
2019/07/10 Python
pygame实现俄罗斯方块游戏(对战篇1)
2019/10/29 Python
Python基于smtplib模块发送邮件代码实例
2020/05/29 Python
Python unittest基本使用方法代码实例
2020/06/29 Python
html5需遵循的6个设计原则
2016/04/27 HTML / CSS
手把手教你实现一个canvas智绘画板的方法
2019/03/04 HTML / CSS
施华洛世奇日本官网:SWAROVSKI日本
2018/05/04 全球购物
街头时尚在线:JESSICABUURMAN
2019/06/16 全球购物
英国门销售网站:Green Tree Doors
2020/01/07 全球购物
军训自我鉴定200字
2014/02/13 职场文书
法学求职信
2014/06/22 职场文书
助残日活动总结
2014/08/27 职场文书
干部作风整顿个人剖析材料
2014/10/06 职场文书
2015年人力资源工作总结
2015/04/08 职场文书
爱心捐书倡议书
2015/04/27 职场文书
高温慰问简报
2015/07/21 职场文书
Python 图片添加美颜效果
2022/04/28 Python