javascript - jQuery 用户界面。创建后将 slider 值插入 block 中

标签 javascript jquery jquery-ui

我试图在创建后将范围 slider 值插入 2 个 block 。

$(document).ready(function() {
$("#slider-range").slider({
    step: 10,
    range: true,
    min: 10,
    max: 500,
    values: [100, 400],
    create: function(event, ui) {
        $('#minResult').text(ui.values[0]+'$');
        $('#maxResult').text(ui.values[1]+'$');
    },
    slide: function(event, ui) {
        $('#minResult').text(ui.values[0]+'$');
        $('#maxResult').text(ui.values[1]+'$');
    },
    stop: function(event, ui) {
        $('#priceMin').val(ui.values[0]);
        $('#priceMax').val(ui.values[1]);
        calcItems();
    }
});
});

滑动和停止回调工作正常,但创建不起作用。 Conosole.log(ui) 返回未定义。请帮忙)

最佳答案

来自create事件的jQuery slider 文档:

Note: The ui object is empty but included for consistency with other events.

引用号:http://api.jqueryui.com/slider/#event-create

您可以使用以下方法直接从 slider UI 对象获取值:

$("#slider-range").slider("values")[0];

代码:

$(document).ready(function () {
    $("#slider-range").slider({
        step: 10,
        range: true,
        min: 10,
        max: 500,
        values: [100, 400],
        create: function (event, ui) {
            $('#minResult').val($("#slider-range").slider("values")[0] + '$');
            $('#maxResult').val($("#slider-range").slider("values")[1] + '$');
        },
        slide: function (event, ui) {
            $('#minResult').val(ui.values[0] + '$');
            $('#maxResult').val(ui.values[1] + '$');
        },
        stop: function (event, ui) {

        }
    });
});

演示:http://jsfiddle.net/IrvinDominin/gFLsz/

关于javascript - jQuery 用户界面。创建后将 slider 值插入 block 中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18920386/

相关文章:

javascript - 无法使用 Babel 单吨编译 TypeScript

javascript - Z-index 和 transition css 属性冲突?

javascript - 与 jquery 和 getElementById 的混淆

javascript - 使用 jQuery 1.2.1 创建 slider

javascript - Object.height 返回半高

javascript - js中的变量在执行前都是转化为对象吗?

javascript - 更改 jQuery UI 小部件中的深层选项

javascript - 通过拖放 DOM 元素在 d3.js 中创建形状

javascript - 在自定义绑定(bind)中扩展可观察对象

javascript - 单击后重置功能