如何在 Windows Surface 上使用 Jquery UI Slider？答案

【问题标题】：How to use Jquery UI Slider on Windows Surface?如何在 Windows Surface 上使用 Jquery UI Slider？
【发布时间】：2016-07-16 06:31:15
【问题描述】：

我正在开发适用于 Windows Surface 的应用程序，并且我正在尝试使用 Jquery UI 滑块。它适用于鼠标事件，但不适用于触摸。

我查看了这个问题here 并尝试了它的解决方案，但它不起作用。（同时使用 jquery-ui-touch-punch 和

-ms-touch-action: none;
touch-action: none;

但它们都不起作用）。

还有其他解决方案吗？

我正在使用 Chromium Portable 运行应用程序并使用 1.11.4 jquery ui 和 jQuery UI Touch Punch 0.2.3。

【问题讨论】：

请说明您使用的确切 JQuery 和 UI 版本。另外，您在 Touch 设备上测试过哪些浏览器？
@Twisty 使用 1.11.4 jquery ui 和 jQuery UI Touch Punch 0.2.3。
好的，我使用 Jquery Slider 演示和 Touch Punch 设置了一个测试：jsfiddle.net/Twisty/fLudwu2b
我在 Internet Explorer 中使用 MS Surface 测试了我的演示，并且滑块按预期工作。
你用的是哪个浏览器，Chromium？哪个版本？除非浏览器本身存在一些 JS 混淆，否则应该可以正常工作。您能否调出 Chromium 中的开发人员工具并查看控制台是否抛出任何错误？尝试复制，但由于我有不同的测试设备，所以很难。

标签： javascript jquery windows jquery-ui chromium-portable

【解决方案1】：

根据您的问题，我设置了以下带有 Touch Punch 的演示：

https://jsfiddle.net/Twisty/fLudwu2b/

JQUERY

$(function() {
  $("#red, #green, #blue").slider({
    orientation: "horizontal",
    range: "min",
    max: 255,
    value: 127,
    slide: refreshSwatch,
    change: refreshSwatch
  });
  $("#red").slider("value", 255);
  $("#green").slider("value", 140);
  $("#blue").slider("value", 60);
});

我使用 IE 在 Surface 设备上测试了演示。它似乎有效。

我建议检查或更新您的测试环境，并确保浏览器中提供最新的 JavaScript。

【讨论】：