Jquery UI Custom的兼容问题
在测试过程中遇到Jquery UI Dialog异常的情况,表现为在拖拽Dialog标头时出现Dialog跳跃的问题,对比jquery ui与jquery在协调工作情况下的运行情况。
1、环境:
Windows 10 分辨率 1366*768
Chrome、Firefox、IE 11
2、JQuery版本:
jquery-1.7.2.js、jquery-1.8.3.js、jquery-1.9.0.js、jquery-1.10.2.js、jquery-1.11.2.js
3、Jquery UI版本:
jquery-ui-1.9.2.custom.js、jquery-ui-1.10.3.custom.js、jquery-ui-1.10.4.custom.js
其他条件:
<body style="height:1500px;">
<input class="showprev" type="button" style="margin-top:400px;" value="窗口" />
</body>
测试时,height=1500,margin-top=400是为了制造y轴滑动到中间时才能点击“窗口”按钮(即当页面高度height很大时,窗口触发事件必须在滑动到页面中间时才能触发);
当在不进行页面滑动时,直接触发窗口时,并不存在该问题。
测试结果如下:
| jquery版本 | jquery ui版本 | Chrome | IE 11 | Firefox |
| jquery-1.8.3.js - | jquery-ui-1.9.2.custom.js | 正常 | 正常 | 正常 |
| jquery-ui-1.10.3.custom.js | 不正常 | 正常 | 正常 | |
| jquery-ui-1.10.4.custom.js | 不正常 | 正常 | 正常 | |
| jquery-1.9.0.js + | jquery-ui-1.9.2.custom.js | 正常 | 正常 | 正常√ |
| jquery-ui-1.10.3.custom.js | 正常 | 不正常 | 不正常 | |
| jquery-ui-1.10.4.custom.js | 正常 | 不正常 | 不正常 |
根据测试结果发现,jquery-ui-1.9.2.custom.js在不同版本的jquery下都能够较好的工作,较高版本的jquery都会出现浏览器不兼容的情况。
既然存在这样的问题,那就得知道定位问题原因,您说呢?找原因去了~
不清楚其他亲是不是也有这个问题
在此附上测试代码
如果您已知道问题原因,还请指导一下...
在测试时发现jquery-ui-1.11.4.js在各版本的jquery时都是正常的,应该是修复了该问题了
Jquery UI Custom的兼容问题的更多相关文章
- 基于Jquery UI的autocompelet改写,自动补全控件,增加下拉选项,动态设置样式,点击显示所有选项,并兼容ie6+
Jquery UI的autocompelete改写 注意:实现功能,除了原版的自动补全内容外,增加一个点击显示所有选项,样式能动态设置. 加载数据的来源为后台数据库读取. 具体代码如下: 引用 从官方 ...
- 使用 jQuery UI 和 jQuery 插件构建更好的 Web 应用程序
简介: 对于那些使用 JavaScript 和 jQuery 库从桌面应用程序转向 Web 应用程序的开发人员来说,他们还不习惯去考虑应用程序基本的外观,因为这些以前都是由操作系统来处理的.了解 jQ ...
- 关于ExtJS、JQuery UI和easy UI的选择问题
转自百度知道. 问:做企业级应用,比如***管理系统,不需要华丽的特效,只希望简单,风格统一.能用到的只有messagebox.tree.grid大概这几个,其他特效不要,忘大神根据自己的见解以及我这 ...
- jquery ui autocomplete 实现点击文本框,出现所有查询信息效果,与bootstrap结合使用修改样式
直接看代码 <!doctype html> <html lang="en"> <head> <meta charset="utf ...
- [转]jQuery UI Dialog Modal Popup Yes No Confirm example in ASP.Net
本文转自:http://www.aspsnippets.com/Articles/jQuery-UI-Dialog-Modal-Popup-Yes-No-Confirm-example-in-ASPN ...
- 可输入自动匹配Select——jquery ui autocomplete
<!doctype html> <html lang="en"> <head> <meta charset="utf-8&quo ...
- 【jQuery UI 1.8 The User Interface Library for jQuery】.学习笔记.7.Slider控件
默认slider的安装启用 为slider自定义风格 修改配置选项 创建一个垂直的slider 设置最大最小值,和默认值 启用多个 手柄 和 范围 slider内置的回调事件 slider的方法 这个 ...
- 【jQuery UI 1.8 The User Interface Library for jQuery】.学习笔记.3.创建控件
像jQuery提供 fn.extend() 方法从而可以简单地创建插件一样,jQuery UI也提供了机制使得创造插件变得简单,也确保了公共API功能在新的插件中被保留. 1.首先,创建一个名为 j ...
- 【jQuery UI 1.8 The User Interface Library for jQuery】.学习笔记.2.更换主题
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
随机推荐
- 架构模式数据源模式之:数据映射器(Data Mapper)
一:数据映射器 关系型数据库用来存储数据和关系,对象则可以处理业务逻辑,所以,要把数据本身和业务逻辑糅杂到一个对象中,我们要么使用 活动记录,要么把两者分开,通过数据映射器把两者关联起来. 数据映射器 ...
- 写一个MySql存储过程实现房贷等额本息还款计算(另外附javascript代码)
写一个MySql存储过程实现房贷等额本息还款计算 MySql存储过程代码如下: DROP procedure IF EXISTS `calc_equal_interest_proc`; DELIMIT ...
- idea 没有智能提示
开发工具要对源码产生提示,现在比较流行的是使用 .d.ts 文件 来编写提示消息 以下的解决办法不是根本之道,估计是开发工具有什么地方可以设置 自动下载 .d.ts 文件,知道的读者还请留言赐教~ 使 ...
- 以太坊ERC20代币合约案例
一.ERC20代币合约与web3调用 ERC20代币合约在小白看来觉得很高大上,但其实就是一个代币的定义标准,方便其他dapp统一调用各种代币的方法.如图: 二.ERC20合约标准 [官方链接] co ...
- 网络Socket编程UDP协议例子
服务端代码 public class UDPChatServer { //通讯端口 private Integer port=8000; //数据报文的通讯通道对象 private DatagramC ...
- 线程中消费者生产者的实例代码(使用Lock类)
http://www.cnblogs.com/DreamDrive/p/6192685.html 这个是用synchronized关键字实现的. Lock可以替换synchronized. 上面用来做 ...
- 【转】深入理解Java中的final关键字
Java 中的final关键字非常重要,它可以应用于类.方法以及变量.这篇文章中我将带你看看什么是final关键字?将变量,方法和类声明为final代表了 什么?使用final的好处是什么?最后也有一 ...
- 堆与堆排序/Heap&Heap sort
最近在自学算法导论,看到堆排序这一章,来做一下笔记.堆排序是一种时间复杂度为O(lgn)的原址排序算法.它使用了一种叫做堆的数据结构.堆排序具有空间原址性,即指任何时候都需要常数个额外的元素空间存储临 ...
- es-05-获取 resthighlevelclient及api
在6.x以前, 使用最多的是transportclient, 但在7.x会被废弃, 先说以前的创建方式: 具体可见:https://www.cnblogs.com/wenbronk/p/6383194 ...
- Spring整合Mybatis原理简单分析
<bean id="sqlSessionFactory" class="org.mybatis.spring.SqlSessionFactoryBean" ...