3

私は現在http://www.eyecon.ro/bootstrap-slider/を使用しており、スライダーを無効化/ロックする方法を知りたいです。

<th>    <b>0%</b> <input type="text" class="spiders" value="" data-slider-min="0" data-slider-max="100" data-slider-step="0.1" 

      data-slider-value="43.7" 
         id="sldid7" > <b> 100%</b>  </th>

スライダー名を動的に取得して、スライダーをロックしようとします。このように何らかの方法でロックしようとしていますが、機能していません。

$( '#'+$(this).prop('id') ).slider().Disable()
4

1 に答える 1

2

この機能を自分で開発する必要があると思います。それほど難しいことではないはずです。ソース コードを見ると、ブール値である disabled と呼ばれる追加のプロパティを追加できます。

コンストラクターでは、次を追加します (私の例の最後の行は私の追加です):

this.min = this.element.data('slider-min')||options.min;
this.max = this.element.data('slider-max')||options.max;
this.step = this.element.data('slider-step')||options.step;
this.value = this.element.data('slider-value')||options.value;

this.disabled = this.element.data('slider-value')||options.disabled; // My addition

次に、Slider.prototype に新しい無効化ブール値を追加します。

over: false,
inDrag: false,
disabled: false, // our new property

その下に、コントロールの有効化/無効化を処理できるいくつかのメソッドを追加できます。

enable: function(){
    this.disabled = false;
},

disable: function(){
    this.disabled = true;
},

ここで、スライダーのノブを動かすイベントを処理する各メソッドで、何もしないでください。したがって、メソッドでは：

mousedown: function(ev) {
...
mousemove: function(ev) {
...
mouseup: function(ev) {

メソッドの先頭に以下を含めます。

if (this.disabled){
    return false;
}

これは理論的には、必要な機能を提供するのに十分なはずです。私はそれをテストしていません。ここにリストしたのは、機能を自分で提供する方法についてのいくつかの指針とある種のアイデアを提供するためです.

目標に近づけるお手伝いができれば幸いです。

于 2013-09-19T11:19:15.790 に答える