2017-04-18 5 views
0

私はchartist.js棒グラフを持っています。 x軸ラベルをカスタマイズしたい私は姓と名を入れ替えるためにいくつかのjqueryを書いた後、テキストの長さが11文字を超える場合は最後に '...'を追加します。動的変更後にJqueryがリセットされています

$(function() { 
     $('#AssignedLineChart .ct-labels, #ResolvedBarChart .ct-labels').find('.ct-label.ct-horizontal').each(function() { 
      var label = $(this).text(); 
      var splitLabel = label.split(","); 
      var newLabel = splitLabel[1] + ", "+splitLabel[0]; 
      if (newLabel.length > 13) { 
       newLabel = newLabel.substring(0, 10) + "..."; 
      } 
      $(this).text(newLabel); 
     }); 
    }); 

最初にページを読み込むとうまくいきました。個々の範囲を表示するための棒グラフにはいくつかの選択肢があります。ラベルを選択すると、ラベルは元の状態に戻ります。オプションを選択するとDOMが変更されます。これは、検査要素タブを開いたときにも発生します。

動的に変更された要素でfindメソッドまたは各メソッドを使用する方法はありますか?

答えて

0
$(function() { 

これは、ページの読み込みが完了して1回だけ起動された場合にのみ適用されます。

オプションを選択するとDOMが変更されます。

だから、現在のプロセスが似ている:

  1. ページのロードが完了します。
  2. 文書準備完了イベントによってラベルが変更されました。 (*)
  3. 他のイベント、この場合は選択オプションによってラベルが変更されました。 (**)

DOMを動的に変更し、上記のようなもの(*)はラベルを再度変更しません。

したがって、オプションを選択した後にラベルを変更するには、上記(**)のオプションを選択した後に行われるコールバック関数でラベルを変更する必要があります。

関連する問題