Question

我正在使用jQuery UI's slider widget，如果页面中还包含prototype js library，我会在IE8中发现以下不正确的行为（其他浏览器都可以）：

将鼠标悬停在手柄上时，按住鼠标按钮会使手柄立即跳到滑块的底部。试图拖动不会移动手柄。
但是，如果我单击滑块 other 上的一个点而不是手柄的当前位置，则手柄会跳到该点，然后我可以自由地拖动手柄（因为它应该。）

从页面中删除原型可以解决此问题。

下面的代码 - 我正在使用jQuery's noconflict所以原则上Prototype和jQuery应该在一起玩得很好......但显然这里有些不对劲。

有关如何解决此问题的任何想法？非常感谢！

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
  <!-- eliminating the following line resolves the bug -->
  <script src="http://ajax.googleapis.com/ajax/libs/prototype/1.6.1.0/prototype.js" type="text/javascript"></script>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
  <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/jquery-ui.min.js" type="text/javascript"></script>
  <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/themes/base/jquery-ui.css" type="text/css" />
  <script type="text/javascript">
    var $j = jQuery.noConflict();
    $j(function () {
      var setupVolumeSlider = function () {
        $j("#volume-slider").slider({
          orientation: "vertical",
          min: 0,
          max: 100
        });
      };
      setupVolumeSlider();
    });
  </script>
  <style type="text/css">
    body { padding: 100px; }
    div#volume-slider { height: 100px;}
  </style>
  </head>
  <body>
    <div id="volume-slider"></div>
  </body>
</html>

Answer 1

为Scott Gonzales和jQuery团队干杯！讨论了here并修正了jQuery Master

PrototypeJS导致jQuery ui的滑块小部件在IE8中失败。有解决方法吗？

1 个答案: