`
wenlongsust
  • 浏览: 75931 次
  • 性别: Icon_minigender_1
  • 来自: 西安
文章分类
社区版块
存档分类
最新评论

EasyUI的combobox组件Chrome浏览器不兼容问题解决办法

 
阅读更多

EasyUI版本:jQuery EasyUI 1.4.1
Chrome浏览器版本:41.0.2272.101 m

问题描述

在Chrome浏览器下,下拉框选择选项之后,选择的值在下拉框中不显示,重新选择,下拉框的值也能自动反选,说明是已经选中了
这里写图片描述

而在IE8浏览器下正常

问题分析

EasyUI是基于jQuery的,兼容性应该杠杠的,于是使用Chrome访问官方网站的示例,结果发现官网示例可以正常显示
于是,使用Chrome的调试工具,详细分析了下html代码
这里写图片描述
发现html不是特别规范,option的显示内容多了一些空格和换行,这应该就是不兼容问题的根本原因了

解决办法

找到了问题的原因,于是删掉多余的空格和换行,重新在Chrome浏览器下测试,结果ok

问题总结

问题的根本原因不是EasyUI,而是因为代码不规范导致。页面是JSP开发的,代码如下:
这里写图片描述
看起来貌似没什么问题,但是实际上生成的html是不规范的
修改后的代码如下:
这里写图片描述

<script type="text/javascript"> $(function () { $('pre.prettyprint code').each(function () { var lines = $(this).text().split('\n').length; var $numbering = $('<ul/>').addClass('pre-numbering').hide(); $(this).addClass('has-numbering').parent().append($numbering); for (i = 1; i <= lines; i++) { $numbering.append($('<li/>').text(i)); }; $numbering.fadeIn(1700); }); }); </script>
分享到:
评论

相关推荐

    最新EasyUI扁平化

    6. **兼容性**:确保EasyUI在主流浏览器上的兼容性,包括Chrome、Firefox、Safari、Edge以及旧版的IE。 7. **性能优化**:合理使用组件的异步加载和分页功能,减少不必要的网络请求,提高页面加载速度。 8. **响应...

    easyui项目

    6. **兼容性好**:EasyUI 兼容主流的浏览器,包括 Chrome、Firefox、Safari、Edge 和 Internet Explorer 等,确保了应用的广泛适用性。 7. **社区支持**:EasyUI 有一个活跃的开发者社区,提供了大量的示例代码、...

    easyui插件

    9. **兼容性**:EasyUI 兼容主流的浏览器,如Chrome、Firefox、Safari、IE等,确保应用在各种环境下都能正常运行。 10. **文档与社区**:EasyUI 拥有详尽的官方文档和活跃的社区,开发者可以在遇到问题时参考文档...

    EasyUI最新版本1.4.4

    9. **兼容性**:EasyUI 通常会尽可能地兼容各种主流浏览器,包括 Chrome、Firefox、Safari、IE 等,确保应用在不同环境下都能正常运行。 10. **社区支持**:EasyUI 拥有一个活跃的开发者社区,遇到问题时,可以在...

    官方EasyUI皮肤最新模板20161201

    1. **EasyUI组件**:EasyUI 提供了诸如窗口(Window)、表格(Grid)、面板(Panel)、菜单(Menu)、下拉框(Combobox)、日期选择器(Datebox)等常见Web应用组件。这些组件都经过了精心设计,具有良好的用户体验...

    jQuery EasyUI 1.4.2 版 API 中文版

    8. **兼容性**:EasyUI 考虑到了浏览器的兼容性问题,它支持主流的浏览器,包括 IE、Firefox、Chrome、Safari 和 Opera,确保了应用在不同环境下都能正常运行。 9. **性能优化**:在使用 EasyUI 时,应关注组件的...

    前端框架EasyUI

    - **版本选择**:确保所使用的 EasyUI 版本与项目的 jQuery 版本兼容,避免出现冲突或不兼容问题。 - **性能优化**:由于 EasyUI 包含了许多组件和样式,可能会影响页面加载速度,因此需要合理使用,避免无谓的资源...

    jquery easyui 模板

    - **跨浏览器兼容**:EasyUI 支持主流浏览器,如 Chrome、Firefox、Safari 和 IE,减少了浏览器兼容性问题的解决时间。 - **响应式设计**:内置的响应式布局适应不同设备屏幕,有助于构建移动优先的 web 应用。 - **...

    EasyUI API 1.7.zip

    - EasyUI致力于兼容各种浏览器,包括Chrome、Firefox、Safari、IE等。 - 通过优化代码和合理的组件设计,EasyUI在保持功能强大之余,也考虑了性能问题。 6. **实例与教程**: - API文档中通常会包含示例代码,...

    easyui介绍加示例加中文帮助文档

    6. **兼容性好**:EasyUI 基于 jQuery,因此它能够很好地兼容各种主流浏览器,包括 Chrome、Firefox、Safari、Edge 和 IE 等。 在压缩包中的示例部分,开发者可以找到各种组件的使用方法,通过运行这些小 demo,...

    EasyUI 1.3.4 官方 API 中文版

    9. **兼容性**:EasyUI 1.3.4 应该兼容主流的浏览器,如 Chrome、Firefox、IE8 及以上版本,确保应用在不同环境下都能正常运行。 10. **更新与维护**:1.3.4 版本发布后,官方可能还会提供更新和维护,修复已知问题...

    EasyUI

    8. **兼容性**:EasyUI 兼容主流的浏览器,包括 Chrome、Firefox、Safari、Edge 和 Internet Explorer 等,保证了应用在不同环境下的良好运行。 9. **插件扩展**:除了内置组件外,EasyUI 还允许开发者自定义插件,...

    easyui的js包

    6. **兼容性**:EasyUI 兼容主流的浏览器,如Chrome、Firefox、Safari、IE9及以上版本,确保了在不同平台上的良好运行效果。 7. **扩展性**:EasyUI 的组件设计模块化,可以与其他JavaScript库或框架(如jQuery UI...

    easyui帮助文档

    9. **兼容性**:EasyUI 考虑到了浏览器兼容性问题,支持主流的浏览器,包括IE8及以上版本,以及Chrome、Firefox等现代浏览器。 10. **教程和示例**:文档中通常会包含丰富的教程和示例代码,帮助开发者快速上手,...

    jQuery EasyUI中文帮助手册

    12. **兼容性**:EasyUI致力于保持与各种浏览器的兼容性,包括IE、Firefox、Chrome、Safari等,确保应用能在各种环境下正常运行。 总之,jQuery EasyUI中文帮助手册是开发人员学习和应用EasyUI的宝贵资源,通过深入...

    easyui框架

    7. **兼容性**:EasyUI兼容大部分现代浏览器,包括Chrome、Firefox、Safari、IE8+等,确保了应用在不同浏览器上的稳定运行。 在使用EasyUI时,开发者需要注意以下几点: - **学习成本**:虽然EasyUI提供了很多便利...

    easyui 1.4.3

    9. **文档与社区支持**:EasyUI 拥有详尽的官方文档,包括组件的使用方法、API 参考以及示例代码,这对于学习和解决问题非常有帮助。此外,活跃的社区论坛也是获取帮助和支持的重要资源。 10. **升级与维护**:虽然...

    easyui个版本文档

    EasyUI 支持多种浏览器,包括 Chrome、Firefox、Safari、IE 等,但对不同浏览器的兼容性可能存在差异。文档中会明确指出哪些版本的浏览器被支持,以及可能出现的问题。 9. **最佳实践与技巧** 文档可能还包括了...

    jQueryEasyUI.1.3.6

    10. **兼容性**:jQuery EasyUI 通常会兼容主流的浏览器,如Chrome、Firefox、IE(至一定版本),确保在广泛用户群体中都能正常运行。 理解并熟练掌握jQuery EasyUI 1.3.6,可以帮助开发者快速构建功能丰富、界面...

    easyui、帮助文档

    同时,EasyUI 兼容多种浏览器,包括Chrome、Firefox、Safari、IE等,确保应用的广泛适用性。 EasyUI 的帮助文档通常会详细解释每个组件的使用方法,包括HTML结构、CSS样式类、JavaScript方法以及相关事件。此外,还...

Global site tag (gtag.js) - Google Analytics