jquery 滑块不适用于 jquery-1.6！答案

【问题标题】：jquery slider does not work with jquery-1.6!jquery 滑块不适用于 jquery-1.6！
【发布时间】：2011-08-24 13:51:15
【问题描述】：

此滑块代码适用于旧版本的 jquery，例如 jquery-1.5。但是当我尝试将它与最新版本的 jquery - jquery-1.6 集成时它不能正常工作。

您可以试试here - 当您沿着滑块滚动时，内容不会滚动。当您向前和向后拖动和移动滑块时，内容应沿滑块滚动。

这里是一些代码，

function init_scrollbar ()
{
    //scrollpane parts
    scroll_frame = $('#scroll-frame'); // scroll-frame
    scroll_content = $('#scroll-content'); // scroll-content
    scroll_location_pixel = 0;
    original_location_scroll_handle = 0;
    original_width_scroll_content = scroll_content.width();

    scrollbar = $('#content-slider').slider({
        min: 0,
        animate: true,
        create: on_scrollcreate,
        change: on_scrollchange,
        slide: on_scrollslide
    });
}

我认为是事件slide 不起作用，这是代码，

function on_scrollslide(event, ui)
{
    var scroll_maximum = scroll_content.width() - scroll_frame.width();
    scroll_frame.attr({scrollLeft: ui.value * (scroll_maximum / 100) });
}

知道我做错了什么吗？你能告诉我怎么解决吗？

谢谢。

【问题讨论】：

有什么迫切的原因要升级吗？

标签： jquery jquery-ui slider slide uislider

【解决方案1】：

对于jQuery 1.6：

从 jQuery 1.6 开始，.attr() 方法返回未定义的属性尚未设置。此外， .attr() 不应该用在普通的对象、数组、窗口或文档。检索和更改 DOM 属性，使用 .prop() 方法。

这是一个有效的fiddle。

【讨论】：

【解决方案2】：

jQuery 现在可以通过其新的.prop() 方法正确区分属性和属性。

在on_scrollslide函数中，将scroll_frame.attr({改为scroll_frame.prop({：

function on_scrollslide(event, ui)
{
    //var scroll_maximum = scroll_frame.attr("scrollWidth") - scroll_frame.width();
    var scroll_maximum = scroll_content.width() - scroll_frame.width();

      // change---vv
    scroll_frame.prop({scrollLeft: ui.value * (scroll_maximum / 100) });
}

【讨论】：

【解决方案3】：

我觉得你应该忽略1.6版本，直接去1.6.1。根据 jQuery 博客：

从 1.5.2 更新到 1.6.1 时，您应该不必更改任何属性代码。

来源： http://blog.jquery.com/

【讨论】：