使用 JQuery 和 JQTouch 清除表单输入字段的按钮
我有一个使用 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 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
如果您将输入类型命名为“搜索”,您会自动得到那个小 X。
这篇文章会给你带来很多帮助。
WebKit 的 CSS 技巧
如果您不希望该输入成为type = search,那么你就得稍微伪造一下。
1.创建一个div并使用css将其舍入。
2. 将您的输入放在那里,并删除 webkit 装饰、阴影等。
3. 将带有 X 图像的 SPAN 放在输入的右侧。向该图像添加一个 onclick 以清除您的字段。
You get that little X automatically if you name your input type = search.
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.