zoukankan      html  css  js  c++  java
  • i8浏览器不支持placeholder属性解决办法,以及解决后,文字不居中问题

    这里想实现的效果是:设置和移除文本框默认值,如下图鼠标放到文本框中的时候,灰字消失。

    1.可以用简单的方式,就是给input文本框加上onfocus属性,如下代码:

    [html] view plain copy
     
    1. <input id="keyword" name="keyword" size="10" class="inputstyle keywords" value="请输入企业名称、统一社会信用代码或注册号"  
    2.             onfocus='if(this.value=="请输入企业名称、统一社会信用代码或注册号"){this.value="";}; '   
    3.             onblur='if(this.value==""){this.value="请输入企业名称、统一社会信用代码或注册号";};'>   

    其实onfocus属性挺好用的,还可以在通过onfocus属性改变css样式,如下代码:

    [java] view plain copy
     
    1. <input id="keyword" name="keyword" size="10" class="inputstyle keywords" value="请输入关键字进行搜索"  
    2.     onfocus='if(this.value=="请输入关键字进行搜索"){this.value="";}; this.className="input01"'   
    3.     onblur='if(this.value==""){this.value="请输入关键字进行搜索";}; this.className="input02"'>   

     在这个问题解决了以后,可能会出现文字不居中的问题,这时候只需要使用一个属性就可以,例如 line-height: 40px

    2.也可以使用jquery实现:

    [javascript] view plain copy
     
      1. $(document).ready(function() {  
      2.         var vdefault = $('#keyword').val();  
      3.   
      4.     $('#keyword').focus(function() {  
      5.             //获得焦点时,如果值为默认值,则设置为空  
      6.             if ($(this).val() == vdefault) {  
      7.                 $(this).val("");  
      8.             }  
      9.         });  
      10.     $('#keyword').blur(function() {  
      11.             //失去焦点时,如果值为空,则设置为默认值  
      12.             if ($(this).val()== "") {  
      13.                 $(this).val(vdefault); ;  
      14.             }  
      15.         });  
    天行健君子以自强不息地势坤
  • 相关阅读:
    版本管理
    图解电路
    Java语言基础
    电工学入门
    11个例子教会你看电路图
    如何提高STM32的学习效率
    开发板入门
    Altium Designer
    电子设计从零开始
    推荐书籍
  • 原文地址:https://www.cnblogs.com/wbqcheng/p/10064825.html
Copyright © 2011-2022 走看看