简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
首頁 > web前端 > js教程 > 主體

javascript如何設定文字方塊輸入時變顏色

醉折花枝作酒筹
發布： 2023-01-06 11:17:07
原創
6477 人瀏覽過

在javascript中，可以使用onfocus事件設定文字方塊輸入時變顏色，只需要給元素綁定onfocus事件，再使用「物件.style.background="顏色值"」即可。 onfocus事件在物件獲得焦點時發生，通常用於表單中。

javascript如何設定文字方塊輸入時變顏色

本教學操作環境：windows7系統、javascript1.8.5版、Dell G3電腦。

動態設定文字方塊顏色：

主要是利用javascript中的触发事件onfocus
<script language="javascript" type="text/javascript">
      <!--
         function myFocus(obj,color){

             //判断文本框中的内容是否是默认内容


             if(obj.value=="请输入收件人地址"){
               obj.value="";
             }

             //设置文本框获取焦点时候背景颜色变换
             obj.style.backgroundColor=color;
         }


         function myblur(obj,color){

             //当鼠标离开时候改变文本框背景颜色
             obj.style.background=color;
         }

 

在input标签中

<input type="text" name="username" id="username" onfocus="myFocus(this,&#39;#f4eaf1&#39;)" onblur="myblur(this,&#39;white&#39;)" value="请输入收件人地址"/>

用上述简单方法可以做到文本框背景颜色的变换和提示信息的清除
登入後複製

onfocus 事件在物件獲得焦點時發生。 Onfocus 通常用於 ,