【问题标题】:input type=search - how to get the "x" but keep my original input layout [duplicate]输入类型=搜索 - 如何获取“x”但保留我的原始输入布局[重复]
【发布时间】:2012-07-20 00:49:57
【问题描述】:

可能重复:
Stop chrome from auto styling input type=search

我想添加许多搜索输入框用于清除信息的小“X”,但我需要保留自己的输入背景、字体大小等。有什么建议吗?

input type"search"

完全改变布局...

【问题讨论】:

    标签: jquery html css


    【解决方案1】:

    您可以尝试使用带有已在其顶部移动的图像的常规文本框,这样它就不会与背景图像混淆。

    HTML

    <div class="clearable">
      <input type="text"/>
      <img src="http://www.hanebutt.co.uk/uploads/content/close_x.gif" />
    </div>
    

    CSS

     .clearable img {position: relative; left: -20px;}
    

    jQuery

    $(document).ready(function() {
      $('.clearable img').click(function() {
        var theInput = $(this).parent().find('input');
        theInput.val("");
        theInput.focus();
      });
    });
    

    你可以在这里看到它的实际效果:http://jsbin.com/afafet

    【讨论】:

      猜你喜欢
      • 2015-08-03
      • 2019-03-24
      • 2017-04-14
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2012-07-20
      • 2012-01-19
      • 1970-01-01
      相关资源
      最近更新 更多