使用 JQuery 和 JQTouch 清除表单输入字段的按钮

发布于 2024-08-19 20:09:24 字数 768 浏览 4 评论 0原文

我有一个使用 JQTouch 构建的网站,想要添加小十字 文本输入字段中的按钮可在按下时清除文本。

我尝试在 google.com iPhone 上模仿 Google 的技术 地点。我也在这里读到了这种方法 mobileSafari 中 iPhone 上的文本字段输入中出现小“x”?...

我有这部分工作。但是否以及何时按下 十字按钮注册似乎不可靠。

我创建了最少的代码来测试这一点:

使用 JQTouch - http://hogtownconsulting.com/clearquery/index.html

没有 JQTouch (或任何其他 JS图书馆)- http://hogtownconsulting.com/clearquery/index-no-js.html

我不确定这是与 JQTouch 库的交互 这就是造成这些问题的原因。但没有 JQTouch 的版本似乎对十字按钮的点击反应更快。关于如何使此功能正常工作的任何建议 正确的将不胜感激。谢谢你,帕特里克

I have a site built using JQTouch and want to add the little cross
buttons within text input fields to clear out text on press.

I've tried emulating Google's technique from their google.com iPhone
site. Also I've read about that approach over here
little 'x' in textfield input on the iphone in mobileSafari?...

I have this partially working. But whether and when a press on the
cross button is registered seems unreliable.

I've created minimal code to test this:

with JQTouch -
http://hogtownconsulting.com/clearquery/index.html

without JQTouch (or any other JS libraries) -
http://hogtownconsulting.com/clearquery/index-no-js.html

I'm not certain that it's an interaction with the JQTouch library
that's causing these problems. But the version without JQTouch does seem more responsive to taps on the cross button. Any suggestions on how I can get this feature working
properly would be much appreciated. Thank you, Patrick

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

与之呼应 2024-08-26 20:09:24

如果您将输入类型命名为“搜索”,您会自动得到那个小 X。

<input type=search name=s>

这篇文章会给你带来很多帮助。
WebKit 的 CSS 技巧

如果您不希望该输入成为type = search,那么你就得稍微伪造一下。
1.创建一个div并使用css将其舍入。
2. 将您的输入放在那里,并删除 webkit 装饰、阴影等。
3. 将带有 X 图像的 SPAN 放在输入的右侧。向该图像添加一个 onclick 以清除您的字段。

<div><input type="text" id="thing"/><span onclick="clrField();"><img src="x.gif"/></span></div>

You get that little X automatically if you name your input type = search.

<input type=search name=s>

This article will help you plenty.
CSS Tricks for WebKit

If you don't want that input to be a type = search, then you will have to fake it out a bit.
1. create a div and round it using css.
2. put your input in there, and remove webkit decoration, shading etc.
3. put a SPAN with your X image in to the right of the input. add an onclick to that image which clears your field.

<div><input type="text" id="thing"/><span onclick="clrField();"><img src="x.gif"/></span></div>
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文