js控制輸入框獲得和失去焦點時狀態(tài)顯示的方法
更新時間：2015年01月30日 10:51:42 作者：comeonstone
這篇文章主要介紹了js控制輸入框獲得和失去焦點時狀態(tài)顯示的方法,可實現(xiàn)判斷輸入框的焦點狀態(tài)設(shè)置不同樣式的功能,是非常實用的技巧,需要的朋友可以參考下
本文實例講述了js控制輸入框獲得和失去焦點時狀態(tài)顯示的方法。分享給大家供大家參考。具體實現(xiàn)方法如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>邊框變色</title>
<style type="text/css">
<!--
.SearchKeyword {border:1px solid #797A75;width: 202px;color: #CDCDCD;font-size:12px;}
.SearchKeywordonFocus {border:1px solid #ABCD3A;width: 202px;color: #000000;font-size:12px;}
-->
</style>
<script language="javascript">
function keywordfocus()
{
if (document.formSearch.keyword.value == '請輸入關(guān)鍵字')
{
document.formSearch.keyword.value = '';
document.formSearch.keyword.className = 'SearchKeywordonFocus';
}
}
function keywordblur()
{
if (document.formSearch.keyword.value == '')
{
document.formSearch.keyword.value = '請輸入關(guān)鍵字';
document.formSearch.keyword.className = 'SearchKeyword';
}
}
</SCRIPT>
</head>
<body>
<form id="formSearch" name="formSearch" method="post" action="">
<input type="text" name="keyword" class="SearchKeyword" value="請輸入關(guān)鍵字" onFocus="keywordfocus();" onBlur="keywordblur();" />
</form>
</body>
</html>
希望本文所述對大家的javascript程序設(shè)計有所幫助。
相關(guān)文章
JavaScript中遞歸實現(xiàn)的方法及其區(qū)別
遞歸函數(shù)是在通過名字調(diào)用自身的情況下構(gòu)成的。下面通過本文給大家分享JavaScript中遞歸實現(xiàn)的方法及其區(qū)別，感興趣的朋友一起看看吧2017-09-09
JavaScript 語言基礎(chǔ)知識點總結(jié)（思維導(dǎo)圖）
這篇文章通過思維導(dǎo)圖格式總結(jié)了JavaScript 語言基礎(chǔ)知識點，想要學(xué)習(xí)js的朋友可以參考下2013-11-11
本文給大家分享基于js組件開發(fā)的輸入框加候選框的實例代碼，代碼簡單易懂，非常不錯，具有參考借鑒價值，需要的的朋友參考下2017-03-03
這篇文章主要介紹了使用正則表達(dá)式的格式化與高亮顯示json字符串的方法，非常的簡單實用,需要的朋友可以參考下2014-12-12
這篇文章主要介紹了director.js實現(xiàn)前端路由使用實例,director.js是最純粹的路由注冊/解析器,它在不刷新頁面的情況下,利用“#”符號組織不同的URL路徑,需要的朋友可以參考下2015-02-02
JavaScript使用Promise實現(xiàn)并發(fā)請求數(shù)限制
本文主要介紹了JavaScript使用Promise實現(xiàn)并發(fā)請求數(shù)限制，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2023-04-04
本文主要是分享了一段由JS生成驗證碼并驗證的代碼，非常簡單，并分析了此方法的實用性，提供給大家參考下2014-09-09
Bootstrap禁用響應(yīng)式布局的實現(xiàn)方法
這篇文章主要介紹了Bootstrap禁用響應(yīng)式布局的實現(xiàn)方法,非常不錯，具有參考借鑒價值，需要的朋友可以參考下2017-03-03
這篇文章主要為大家詳細(xì)介紹了使用zepto.js，純JS寫的登錄界面，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-10-10
這篇文章主要介紹了JS實現(xiàn)單行文字不間斷向上滾動的方法,以實例形式較為詳細(xì)的分析了文字滾動效果實現(xiàn)的原理與技巧,需要的朋友可以參考下2015-01-01