类型为search的input及相关属性

其实在很久很久之前就发现search类型的input,该属性值是WebKit私有,不过一直没去查相关的属性,介于XXX原因,我找出其属性,回头考虑在其他浏览器上也实现这样的效果。表扬一下Yupoo,他们上次改版就使用上介个。

如果你使用的是Safari(iphone上的不一样,不过会Go按钮会变成Search)或者是其他WebKit引擎的浏览器的话,你就可以看出下面这个input与其他的不同了。

看不到的朋友可以看一下图片:
safari-input-type-search

看一下相关的代码:

<input type="search" placeholder="测试搜索" autosave="aoao.org.cn" results="8" >

相关的说明,就几个属性的介绍,比较简单,没有译了中文,大家看看就是,其实不用看也要以猜得出。

The incremental attribute can be used to control whether or not the search is performed as you type.

The placeholder attribute can be used to set the greyed placeholder text in the control.

The autosave attribute allows you to specify an autosave name for your search results in the dropdown. What’s cool about the autosave is that it’s global, which means that two Web sites could put up a search field with an autosave name of google and then they would share the search results. (Since the actual result values are not accessible to the page there is no privacy violation.)

The results attribute allows you to specify how many results should be displayed in the dropdown.

The search DOM event fires at the precise time the search should be performed and obeys the heuristic for the control, so you don’t have to trap key and click events at all. You can use the onsearch attribute on the control to respond when the search happens.

BTW:CSS Naked Day差不多到了,今年改在9号,有兴趣的朋友凑凑热闹。

This entry was posted in Web开发 and tagged , , , . Bookmark the permalink.

6 Responses to 类型为search的input及相关属性

  1. MarVell @ 2008-04-11 at 00:10

    还在裸奔 – -!

  2. Sinina @ 2008-04-11 at 23:35

    可惜我还是没有明白你的意思,能否说详细点呢???

  3. aoao @ 2008-04-12 at 04:46

    @Sinina 你去下个 Safari然后再看一下这里就明白了。

  4. karsa @ 2008-04-14 at 16:22

    裸奔滴人啦,幸福的人

  5. Amer @ 2008-06-09 at 11:06

    yeah~~~~ 又来小站踩点啦~~~~~

  6. 天堂左我往右 @ 2009-04-16 at 21:22

    为何俺用safari4没有看出不同呢

发表评论

(必填)

(必填)