Jqueryスライダでリフレッシュスクリプトの間隔を変更する

私は毎秒私のdivをリフレッシュするためにこのコードを使用しています:

     <script>
 $(document).ready(function() {
  $("#container").load("stats.php");
   var refreshId = setInterval(function() {
      $("#container").load('stats.php');
   }, 10*1000);
   $.ajaxSetup({ cache: false });
});
</script>

This works great, only thing i want to add is a slider like this one: http://jqueryui.com/demos/slider/#steps

リフレッシュタイマーの間隔をデフォルトで10秒(10 * 1000)に設定できるようにしたい。

スライダに値を変更させることは可能ですか?もしそうなら、どうしたらいいですか?

ありがとう!

1
jQuery UIスライダのメソッドを読んでいますか? jqueryui.com/demos/slider/#widget-docs
追加された 著者 MatTheCat,

2 答え

あなたのスクリプトは次のようなものになります:

 $(document).ready(function() {
     var intSeconds = 10;
     var refreshId;


     function sTimeout()
     {
         //Load content
          $("#container").load("stats.php");

         //Saving the timeout
          refreshId = setTimeout(function() {
             sTimout();
         }, intSeconds *1000);
     }
     sTimeout();
     $.ajaxSetup({ cache: false });

    //The slider
     $(".ui-slider").slider({
         min : 1,//minimum value
         max : 20,//Maximum value
         value : intSeconds,//Copy current  value
         change: function(event, ui) {
             clearTimeout(refreshId);//clear it
             intSeconds = ui.value;//Update value
             sTimeout(); //Restart it
         }
     });
});

スライダーDIVをソースに追加してチェックアウトしてください。

2
追加された
私よりも良い例、素敵!
追加された 著者 Christofer Eliasson,
おそらく、最小値として0を使用することは、setTimeoutが極端な頻度でトリガする原因となり、stats.phpに対して非常に大量の要求を引き起こすため、最善の考えではありません。あるいは、私はsetTimeoutの動作について間違っていますか?
追加された 著者 Christofer Eliasson,
私はスライダのdivを追加しました、スライダ自体が動作している、リフレッシュはもはや、任意のアイデアではない?私も#と#の違いは何か不思議だった。スライダ$( ".ui-slider")。スライダは、スライダ自体が、#の代わりに#を使用した場合にのみ表示されることに気付きました。 ?
追加された 著者 user990767,
これは素晴らしい今、両方のあなたに感謝しています!
追加された 著者 user990767,
いいえ、1に設定する必要があります。それ以外の場合は、setTimeoutは0 msごとに呼び出されます
追加された 著者 Niels,
私はtypo関数を作成しましたsTimout()は関数sTimeout()でなければなりませんでした。私はtim * out()の後に "e"
追加された 著者 Niels,

スライダを次のように追加します。

var interval = 10000;
$( "#slider" ).slider({
  value:10,
  min: 1,
  max: 20,
  step: 1,
  slide: function( event, ui ) {
    interval = ui.value * 1000;
  }
});

setIntervalを使用する代わりに、setTimeoutを使用することもできます。

(function reload() {
      $("#container").load('stats.php');
      setTimeout(reload(), interval);
   })();
0
追加された
JavaScript - 日本のコミュニティ
JavaScript - 日本のコミュニティ
2 参加者の

日本人コミュニティのjavascript