搜索exactquery / xq-select
Requires
- components/jquery: ^1.10
- deviscoding/base: ^2.0
- deviscoding/searchable: ^2.0
Replaces
- exactquery/xq-select: ^2.0
README
xqSelect软件包旨在使HTML5表单选择在跨浏览器和平台上看起来和表现一致。使用jQuery插件、CSS和Bootstrap的dropdown.js来美化普通选择框并增加额外功能。
有许多功能强大的jQuery插件做类似的事情，并感谢这些作者为原始想法的功劳。
xqSelect与类似插件在几个小方面有所不同
- 有意减少功能以减小体积和复杂性。
- 小于8KB压缩 - 如果只使用CSS则为4KB（见下文）。
- 原始选择框仍然被使用，并且不会被隐藏或移出屏幕。
文档
xqSelect的文档正在完善中，将尽可能进行更新。目前，请参阅以下基本演示和使用说明。
使用和演示
基本演示可以在BootPly上查看。更完整的演示将很快提供。
使用很简单
<div class="xq-select">
<select id="xqSelectDemo">
<optgroup label="Group One">
<option value="1" data-subtext="First Thing">Item One</option>
<option value="2">Item Two</option>
<option value="3">Item Three</option>
<option value="4">Item Four</option>
</optgroup>
<option value="5">Item Five</option>
<option value="6">Item Six</option>
<option value="7">Item Seven</option>
<option value="8">Item Eight</option>
</select>
</div>
当然，这假设您已经在您的HTML页面中某处包含了分布JS和CSS。建议将样式表放在<head>中，将JS放在您的关闭</body>标签之前。
为了自动切换到大多数移动设备上的本地选择，请在<div class="xq-select">标签中包含属性data-mobile="true"。
浏览器兼容性
xqSelect的一个重要目标是跨浏览器兼容性。鼓励报告特定浏览器和平台的问题。以下有指导方针。
截至目前，以下浏览器预期完全支持
| 浏览器 | 版本 | 平台 | 状态 |
|---|---|---|---|
| Chrome | ?* | Win/Mac/Linux | 支持 |
| Firefox | ?* | Win/Mac/Linux | 支持 |
| Opera | 15+ | Win/Mac/Linux | 支持 |
| Safari | 6.2+ | Mac | 支持 |
| Safari | iOS 8/9+ | iOS | CSS Only |
| Chrome | iOS 8/9+ | iOS | CSS Only |
| Chrome | Android 5.0+ | Android | CSS Only |
| Firefox | Android 5.0+ | Android | CSS Only |
| Internet Explorer | 8 | Win | 支持 |
| Internet Explorer | 9/10 | Win | 支持 |
| Internet Explorer | 11 | Win | 支持 |
| Edge | 所有 | Win | 支持 |
以下浏览器预期仍然可以工作
| 浏览器 | 版本 | 平台 | 状态 |
|---|---|---|---|
| Opera | 11/12 | Win/Mac/Linux | 需要测试 |
| Opera | 10 | Win/Mac/Linux | 不支持 |
| Safari | 5.1.4+ | Mac | 需要测试 |
| Safari | iOS 6.1 - 7 | iOS | 需要测试** |
| Android 浏览器 | Android 5.0+ | Android | 需要测试** |
| Opera Mini | 所有 | 所有 | 需要测试** |
| Internet Explorer | 所有 | Windows Phone | 需要测试** |
无意支持IE7、Opera 10、Safari 4或类似版本的自更新浏览器，如Firefox和Chrome。
移动浏览器标记为“CSS Only”，因为在可能的情况下应始终使用本地选择以确保最佳用户体验。理想情况下，CSS规则将确保<select>在浏览器之间看起来一致，但点击后将由本地选择接管。有关如何实现此功能的说明，请参阅上面的使用。
有关更多浏览器兼容性信息，请参阅jQuery浏览器支持和Bootstrap支持的浏览器。
* 需要找到xqSelect可以工作的最低版本。
** 需要测试。预期只CSS组件能够正常工作。
错误和功能请求
欢迎任何人贡献。请阅读以下有关提交问题的重要信息！
版权和许可
版权 (C) 2014-2016 ExactQuery
许可协议为MIT许可协议。