简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
집 > 웹 프론트엔드 > JS 튜토리얼 > 본문

자바스크립트 입력 시 텍스트 상자 색상이 변경되도록 설정하는 방법

醉折花枝作酒筹
풀어 주다： 2023-01-06 11:17:07
원래의
6478명이 탐색했습니다.

JavaScript에서는 onfocus 이벤트를 사용하여 입력 시 색상이 변경되도록 텍스트 상자를 설정할 수 있습니다. onfocus 이벤트를 요소에 바인딩한 다음 "object.style.Background="color value""를 사용하기만 하면 됩니다. onfocus 이벤트는 객체가 초점을 얻을 때 발생하며 일반적으로 양식에 사용됩니다.

자바스크립트 입력 시 텍스트 상자 색상이 변경되도록 설정하는 방법

이 튜토리얼의 운영 환경: Windows 7 시스템, JavaScript 버전 1.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는 일반적으로 ,