js實現(xiàn)鼠標(biāo)點擊文本框自動選中內(nèi)容的方法
本文實例講述了js實現(xiàn)鼠標(biāo)點擊文本框自動選中內(nèi)容的方法。分享給大家供大家參考。具體如下:
這里使用JS實現(xiàn)鼠標(biāo)點擊時自動選中文本框文本的效果,相信許多朋友都遇到這種功能的,就是當(dāng)我們點擊文本框的時候,文本框中默認(rèn)的文字會被全部選中,這樣當(dāng)你輸入的時候不用再去選擇,省去了一些麻煩,提高了輸入效率,用戶肯定會喜歡這功能,那么實現(xiàn)的方法是怎么樣呢?通過本代碼你就搞明白了。
先來看看運行效果截圖:
在線演示地址如下:
http://demo.jb51.net/js/2015/js-mouse-click-pitch-style-codes/
具體代碼如下:
<!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">新聞標(biāo)題:</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">新聞內(nèi)容:</font></div></td> <td rowspan="2"><textarea name="content" cols="50" rows="6" onClick="Myselect_txtarea()">今日,據(jù)相關(guān)方面報道,...</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程序設(shè)計有所幫助。
相關(guān)文章
微信小程序?qū)崿F(xiàn)topBar底部選擇欄效果
這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)topBar底部選擇欄效果,具有一定的參考價值,感興趣的小伙伴們可以參考一下2018-07-07JavaScript獲取時區(qū)實現(xiàn)過程解析
這篇文章主要介紹了JavaScript獲取時區(qū)實現(xiàn)過程解析,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下2020-09-09webpack4.0+vue2.0利用批處理生成前端單頁或多頁應(yīng)用的方法
這篇文章主要介紹了webpack4.0+vue2.0利用批處理生成前端單頁或多頁應(yīng)用的方法,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-06-06JS與Jquery獲取屏幕、瀏覽器、頁面的寬度和高度對比整理
頁面的展示,從外到內(nèi)的容器為:屏幕、瀏覽器以及頁面本身。HTML元素展現(xiàn)在頁面內(nèi),頁面展現(xiàn)在瀏覽器內(nèi),而瀏覽器展現(xiàn)在屏幕內(nèi)。通過Js的一些對象可以獲取這些容器的高度、寬度。容器的尺寸是指當(dāng)前分辨率下的高度和寬度(分辨率不同,值就不相同)。2023-02-02tsc性能優(yōu)化Project References使用詳解
這篇文章主要為大家介紹了tsc性能優(yōu)化Project References使用詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2022-11-11JS實現(xiàn)帶鼠標(biāo)效果的頭像及文章列表代碼
這篇文章主要介紹了JS實現(xiàn)帶鼠標(biāo)效果的頭像及文章列表代碼,涉及JavaScript響應(yīng)鼠標(biāo)事件動態(tài)切換頁面元素樣式的相關(guān)技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-09-09