如何创建一个 jQuery 价格滑块答案

【问题标题】：How to create a jQuery price slider如何创建一个 jQuery 价格滑块
【发布时间】：2013-03-04 11:19:28
【问题描述】：

我一直在寻找教程，但没有成功。我不是要求任何人为我做这项工作，而是更多地看看是否有人知道任何有用的东西。

所以基本上我需要我的滑块有一个最小值为零和一个动态设置的最大值（获取动态值不是问题）。

0 -------o-------------------- 200

所以中间的“o”将是您的可点击滑动元素。我需要它在右侧的框中输出您所在的号码。所以在这个例子中它会输出 100。非常像在视频播放器上设置音量。

基本上这是针对奖励积分系统，因此人们可以滑动查看他们有多少奖励积分，它会输出这相当于多少磅。

正如我所说，我更多的是寻求帮助来寻找教程，但如果有人能发布一个能将我推向正确方向的 sn-p，我将永远感激不尽。

【问题讨论】：

检查jqueryui.com/slider

标签： jquery slider draggable

【解决方案1】：

看看http://jqueryui.com/slider/#range

这将为您提供所需值的范围滑块

【讨论】：

这是我最终使用的，但我不确定它的跨浏览器兼容性如何。我很快就会知道的。

【解决方案2】：

Try this:

http://jquerymobile.com/demos/1.0a2/#docs/forms/forms-slider.html

<body class=""> 
<link rel="stylesheet" href="jquery.css">

<script src="jquery-1.js"></script>
<script type="text/javascript" src="jquery.js"></script>
<div class="" id="" data-role="page">

<div class="ui-field-contain ui-body ui-br" data-role="fieldcontain">
<input class="" name="slider" id="slider" value="100" min="0" max="10" data-type="range">
</div>

【讨论】：