1

私はこの jquery jslider プラグインhttp://egorkhmelev.github.com/jslider/を使用しています。これは非常にうまく機能します。基本的に、「入力」項目をスライダーに「再描画」することで機能します。

ドキュメントの準備は正常に機能し、期待どおりにスライダーを描画しますが、次に、ユーザーの選択に基づいて ajax 呼び出しを使用して、ページ上の「入力」の数、したがってスライダーの数を変更していますが、私が持っているもの難しいのは、プラグインが ajax 呼び出しの後に新しい入力の上にスライダーを「再描画」することです。

関数 initSliders() 内にスライダー呼び出しをラップしようとしました。以下を参照してください。そのため、ajax 呼び出し後に更新できますが、スライダーは再描画されません。

助言がありますか？

プラグインに必要なビット:

// ajax の前に

<div id="decide1_right">
    <input id="Sliderx" type="slider" name="area" value="20;100" />
</div>

// ajax の後

<div id="decide1_right">
    <input id="Sliderx" type="slider" name="area" value="20;100" />
    <input id="Slidery" type="slider" name="area" value="20;100" />
</div>

// ajax 投稿

$.post(
   "<?php echo base_url('index.php/test/getCriteriaItems');?>", 
   {criteria: row_id}, 
   function(data) {
     $("#decide1_grp").html(data);  // returns <input>'s for sliders
   }
);
initSliders();

// スライダーのもの

$(document).ready(function() {
  initSliders();
});

// スライダーのもの

function initSliders() {
   $("#Sliderx").slider({ 
      from: 0, 
      to: 120, 
      step: 0.1, 
      format: { format: '##.0'},
      round:1,
      scale: ['0', '20%', '40%', '60%', '80%', '100%', '120%'], 
      limits: false,
   });
   $("#Slidery").slider({ 
      from: 0, 
      to: 120, 
      step: 0.1, 
      format: { format: '##.0'},
      round:1,
      scale: ['0', '20%', '40%', '60%', '80%', '100%', '120%'], 
      limits: false,
   });
}
4

1 に答える 1

2

jquery の ajaxComplete 関数を使用します。すべての ajax 呼び出しの後に起動する必要があります。

$("#Sliderx, #Slidery").ajaxComplete(function () {
   //logic here
});

http://api.jquery.com/ajaxComplete/

于 2012-10-18T09:48:30.843 に答える