精华内容
下载资源
问答
  • 显示隐藏文本框内容

    2021-01-16 21:06:11
    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>... input {
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Document</title>
    </head>
    <style>
        input {
            color: #999;
        }
    </style>
    <body>
        <input type="text" value="手机"/>
        
        <script>
            var text = document.querySelector('input');
            //获得焦点事件 onfocus
            text.onfocus = function() {
                  if(this.value === '手机') {
                           this.value = '';
                  }
                  //输入文字颜色变深
                  this.style.color = 'black';
            }
            //失去焦点 onblur
            text.onblur = function() {
                if(this.value === '') {
                    this.value = '手机';
                    this.style.color = '#999';
                }
            
    
            }
        </script>
    </body>
    </html>
    
    展开全文
  • 描述 当鼠标点击文本框时,里面的默认文字隐藏,当鼠标离开文本框时,里面的文字显示。 分析 ①首先表单需要2个新事件,获得焦点 onfocus 失去焦点 onblur ② 如果获得焦点, 判断表单里面内容是否为默认文字,如果...

    描述 当鼠标点击文本框时,里面的默认文字隐藏,当鼠标离开文本框时,里面的文字显示。
    分析
    ①首先表单需要2个新事件,获得焦点 onfocus 失去焦点 onblur
    ② 如果获得焦点, 判断表单里面内容是否为默认文字,如果是默认文字,就清空表单内容
    ③ 如果失去焦点, 判断表单内容是否为空,如果为空,则表单内容改为默认文字

    <script>
            var text = document.querySelector('input');      
            text.onfocus = function() {         
                  if (this.value == "手机") {              
                   this.value = "";           
                   }           
                   this.style.color = '#333';       
            }       
             text.onblur = function() {          
                     if (this.value == "") {              
                     this.value = "手机";        
                     }            
                     this.style.color = '#999';      
                }
    </script>
            
      
    
    展开全文
  • //显示隐藏文本框内容 //当鼠标点击文本框的时候,里面的默认文字隐藏,当鼠标离开文本框的时候,里面的文字显示。 //案例分析: //首先表单需要两个新的时间,获得焦点**onfocus**和失去焦点**onblur** <input ...

    案例
    在这里插入图片描述

    //显示隐藏文本框内容
    //当鼠标点击文本框的时候,里面的默认文字隐藏,当鼠标离开文本框的时候,里面的文字显示。
    //案例分析:
    //首先表单需要两个新的时间,获得焦点**onfocus**和失去焦点**onblur**
    
    <input type="text" value="手机">
         <script>
              // 1,获取元素
              var text=document.querySelector('input');
              // 2,注册事件
              // 获取焦点
              text.onfocus=function(){
                   // 获取焦点时,如果输入框里面的值是原来的值,那就把这个默认的值给清空
                   if(this.value==='手机'){
                        this.value='';
                   }
                   // 获取焦点需要把文本框里面的文字颜色变黑
                   this.style.color='#333';
              }
              // 失去焦点
              text.onblur=function(){
                   if(this.value===''){
                        this.value = '手机';
                   }
                   // 失去焦点时,需要把文本框里面的文字颜色变浅
                   this.style.color='#999';
              }
         </script>
    
    展开全文
  • 当单击文本框时,里面的默认提示文字会隐藏,鼠标指针离开文本框,里面的文字会显示出来。 效果图如下: 当未单击文本框时: 当单击文本框时: html页面中代码如下: <input type="text" id="userName" value=...

    【案例分析】本案例需要为一个文本框添加提示文本。当单击文本框时,里面的默认提示文字会隐藏,鼠标指针离开文本框,里面的文字会显示出来。

    效果图如下:

    当未单击文本框时:
    在这里插入图片描述
    当单击文本框时:
    在这里插入图片描述
    实现步骤如下:

    1、为元素绑定获取文本框焦点事件onfocus和失去焦点事件onblur
    2、如果获取焦点时,需要判断表单里面的内容是否为默认文字;如果是默认文字,就清空表单内容
    3、如果失去焦点,需要判断表单内容是否为空;如果为空,则表单里边的内容改为默认文字

    html页面中代码如下:

        <input type="text" id="userName" value="手机" style="color: #999;">
        <script>
            //1.获取元素:input
            var text = document.querySelector('input');
            //2.给元素注册获取焦点的事件:onfoucs
            text.onfocus = function () {
                if (this.value === '手机') {
                    this.value = '';
                }
                this.style.color = '#333';
            }
            //3.给元素注册失去焦点的事件:onblur
            text.onblur = function () {
                if (this.value === '') {
                    this.value = '手机';
                }
                this.style.color = '#999';
            }
        </script>
    
    展开全文
  • 效果展示: 代码展示: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <style>...input type="text" value="手机">.
  • 显示隐藏文本框内容 获得焦点onfocus 失去焦点onblur <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, ...
  • 分析:在我们打开百度、京东等时,会发现这样一个现象:它们的搜索框内有文字,但是当我们的光标在搜索框内时,搜索框内的内容会消失,当光标离开且搜索框内为空时,默认内容又会显示出来。 想实现这个功能,我们要...
  • <!... <... ...显示隐藏文本框内容</title> <style> input{ color:#999; } </style> </head> <body> <input type="text" value="手机"> <s.
  • 文字超链接 文本框下面可以加个按钮吗? 按钮跟输入框放在一个DIV里面啦 Bom对象 文字超链接 原文:http://www.cnblogs.com/hanxue53/p/4298257.html
  • 关于文本框的一些简单操作 获得焦点的时候,text的value默认为空,然后输入我们想要的值;失去焦点的时候再显示原来的value值。 <!DOCTYPE html> <html lang="en"> <head> <meta charset=...
  • JavaScript基础学习 显示隐藏文本框内容 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=devcie-width,initial-scale=1.0"&...
  • <style> .box { position: relative; width: 400px; border-bottom: 1px solid #ccc; margin: 100px auto; } .box input { width: 370px; height: 30...
  • <button @click="showInput()"> <i class="el-icon-caret-right"></i> <div class="desclass">项目描述</div> </button>
  • 代码如下:publicclassLoginActivityextendsActivityimplementsView.OnClickListener{privateLoginActivitycontext;privateEditTextet_name;privateEditTextet_pwd;@Overrideprotecte...代码如下:public class ...
  • 情况是这样,有一个文本框,下边有一下拉框 类似日历选取那样,下拉框里有按钮可点击,当鼠标点击(或聚焦)文本框... 那么有什么方法 可以实现 点击文本框显示,点击下拉框里边不隐藏, 点击下拉框以外时(任意空白)才...
  • 比如,input输入框中的提示信息,怎样才能根据对象获得和失去焦点而实现其显示和隐藏。今天在这里,想跟大家分享一下这个小技巧,希望各位大神不要拍砖哦~~~一、要求input输入框,在光标显示时,隐藏提示信息;光标...
  • 我有下面的代码,我呈现出姓名,复选框,文本框: -隐藏/显示@ Html.TextBoxFor@for (var i = 0; i < Model.checkBoxListTeamA.Count();i++){@Html.HiddenFor(it => it.checkBoxListTeamA[i].PlayerId)@...
  • 展开全部 一e68a8462616964757a686964616f31333363373766 主要实现技术 Java...//把按钮的文字显示到文本框中. } } public static void main(String[] args) { new MyFrame(); // 创建窗口实例 } } 运行效果图
  • 报错的使用 txtCh.SelectAll(); txtCh.Focus(); //通过客户号检查流程 exeRes = utsconn.GetCheckRoute(txtCh.Text); if (exeRes.Status) { dtTemp = new DataTable();... dtTemp = (DataTable)exeRes.Anything;
  • 去掉:只留下边框:CSS - input 只... border-bottom: 1px solid #000文本框input&colon;text文本框 CreateTime--2017年4月24日10:40:40 Author:Marydon 一.文本框 (一)标签 ...input type &equals;text,按...
  • 下拉选择框onchange触发隐藏输入框window.onload=function(){var sel=document.getElementById("sel");if (sel.value=="隐藏输入框1") {var sum1=document.getElementById("input1");//隐藏输入框1sum1.style....
  • 选择对应的textbox文本框 在该textbox中,选择KeyPress 事件,双击创建一个事件对应的函数 在函数中根据你的希望输入如下代码 e.Handled = “0123456789ABCDEF\b”.IndexOf(char.ToUpper(e.KeyChar)) < 0; 比如我...
  • 复制代码代码如下:#showDiv {background-color:red;width:300px;height:300px;display:none;}.from-below,.from-below-to-below .effeckt-modal {-webkit-transform: translateX(100%);-ms-transform: scale(0.5);...
  • 在mount时,为什么会调用三次arr2的方法,我怎么在input的值改变的时候才显示下方input的对应内容,现在一直显示,我无法在arr2中控制其显示隐藏@{ViewBag.Title = "Index";Layout = "~/Views/Shared/_Layout.cshtml...
  • vue限制文本框输入数字的正确姿势

    千次阅读 2020-12-19 11:35:51
    最近遇到一个需求,需要限制文本框输入数字,而number类型的输入框有箭头,个人不是很喜欢,因此想要寻求其它途径实现。本想通过网上找个现成的插件,然而百度,谷歌一番都没有找到满意的答案,至于随手一搜出来的...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 67,112
精华内容 26,844
关键字:

怎么隐藏文本框