科尔多瓦的滑块答案

【问题标题】：Slider in cordova科尔多瓦的滑块
【发布时间】：2017-06-27 07:17:23
【问题描述】：

我正在使用cordova 创建一个应用程序。滑块出现错误。
HTML

<body>
<div id="slider">
    <div id="custom-handle" class="ui-slider-handle"></div>
</div>
    <script type="text/javascript" src="scripts/jquery-2.1.4.min.js"></script>
    <script type="text/javascript" src="scripts/jquery-ui-1.12.1.js"></script>
    <script type="text/javascript" src="scripts/jquery.mobile-1.4.5.min.js"></script>
<script type="text/javascript" src="scripts/bootstrap-slider.min.js"></script>
    <script type="text/javascript" src="scripts/temperature.js"></script>
</body>

javascript

$(function () {
    var handle = $("#custom-handle");
    $("#slider").slider({
        create: function () {
            handle.text($(this).slider("value"));
        },
        slide: function (event, ui) {
            handle.text(ui.value);
        }
    });
});

CSS

#custom-handle {
    width: 3em;
    height: 1.6em;
    top: 50%;
    margin-top: -.8em;
    text-align: center;
    line-height: 1.6em;
}

错误

VM93 jquery-2.1.4.min.js:2 未捕获错误：滑块小部件实例没有此类方法“值” 在 Function.error (http://localhost:4400/scripts/jquery-2.1.4.min.js:2:1821) 在 HTMLDivElement。 (http://localhost:4400/scripts/jquery.mobile-1.4.5.min.js:3:10693) 在 Function.each (http://localhost:4400/scripts/jquery-2.1.4.min.js:2:2882) 在 n.fn.init.each (http://localhost:4400/scripts/jquery-2.1.4.min.js:2:847) 在 n.fn.init.a.fn.(匿名函数) [作为滑块] (http://localhost:4400/scripts/jquery.mobile-1.4.5.min.js:3:10498) 在 HTMLDivElement.create (http://localhost:4400/scripts/temperature.js:5:33) 在 a.(匿名函数).(匿名函数)._trigger (http://localhost:4400/scripts/jquery.mobile-1.4.5.min.js:3:14553) 在 a.(匿名函数).(匿名函数)._createWidget (http://localhost:4400/scripts/jquery.mobile-1.4.5.min.js:3:11664) 在新的 a.(匿名函数).(匿名函数) (http://localhost:4400/scripts/jquery.mobile-1.4.5.min.js:3:9187) 在 HTMLDivElement。 (http://localhost:4400/scripts/jquery.mobile-1.4.5.min.js:3:10922)

【问题讨论】：

您在head 中引用了三个带有滑块的不同库，我相信您需要先清理一下。

标签： javascript jquery html css cordova

【解决方案1】：

上线：

handle.text($(this).slider("value"));

应该是

handle.text($(this).slider.val());

或

handle.text($(this).slider.attr("value");

编辑：实际上发现了一个关于类似问题的线程here。使用您的代码，您尝试访问滑块上名为“value”的方法，但是，此方法不存在。根据npmjs 上的文档，这可以通过“getValue”方法访问。因此，您的代码应更新为：

handle.text($(this).slider("getValue"));

【讨论】：

一般来说，如果答案包含对代码的用途的解释，以及为什么在不介绍其他人的情况下解决问题的原因，答案会更有帮助。