jquery - input type=search - 如何获取 "x"但保留我的原始输入布局

标签 jquery html css

<分区>

Possible Duplicate:
Stop chrome from auto styling input type=search

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

input type"search"

完全改变布局...

最佳答案

您可以尝试使用常规文本框,并在其上方移动图像,这样它就不会与背景图像混淆。

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

关于jquery - input type=search - 如何获取 "x"但保留我的原始输入布局,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11565396/

上一篇:javascript - 受 jQuery 图片库影响的页面高度

下一篇:html - CSS 目标点击多次

相关文章:

javascript - 通过注册表单提交时,图像未存储在 php 中的服务器上

javascript - 仅选择特定的点击

html - 如何在 html 文档中显示 SVG 代码?

javascript - 使特定字符(或类/ID)成为字符串的中心点

javascript - jquery selectbox css - 尝试更改字体颜色无法按预期工作

php - 使用 jquery 从 javascript 到 php 进行 AJAX 调用

javascript - 使用 JSON 数据动态命名 dataTable 中的列

javascript - 显示选定的复选框在 javascript 中不起作用

html - 麻烦居中 Div?

html - PNG 按钮未正确点亮