1

これを説明するのは難しいかもしれませんが、最善を尽くします。

次のような設定のテーブルがあります。

<tr>
  <td class="tac">3</td>
  <td><a href="/horse/speared">Speared</a></td>
  <td class="tac">9</td>
  <td>L Camilleri</td>
  <td class="br tac">58kg</td>
  <td id="odd" class="tac betNumber"><a href="#"></a></td>
  <td id="odd" class="tac betNumber"><a href="#">15</a></td>
  <td id="odd" class="tac betNumber"><a href="#">15</a></td>
  <td id="odd" class="tac betNumber"><a href="#">15</a></td>
  <td id="odd" class="tac betNumber"><a href="#">13</a></td>
  <td id="odd" class="tac betNumber"><a href="#">21</a></td>
  <td id="odd" class="tac betNumber"><a href="#">13</a></td>
</tr>
<tr>
  <td>4</td>
  <td><a href="/horse/sneakin-around">Sneakin' Around</a></td>
  <td class="tac">17</td>
  <td>P King</td>
  <td class="br tac">58kg</td>
  <td id="odd" class="tac betNumber"><a href="#"></a></td>
  <td id="odd" class="tac betNumber"><a href="#">11</a></td>
  <td id="odd" class="tac betNumber"><a href="#">12</a></td>
  <td id="odd" class="tac betNumber"><a href="#">11</a></td>
  <td id="odd" class="tac betNumber"><a href="#">21</a></td>
  <td id="odd" class="tac betNumber"><a href="#">12</a></td>
  <td id="odd" class="tac betNumber"><a href="#">21</a></td>
</tr>

id="odd" の td それらが変更されたかどうかを確認し、変更された場合は、フラッシュまたは 2 ～ 3 秒間続くだけの「更新済み」クラスを追加します。私はコードをロードします：

$(document).ready(function() {
   $("#responsedcontainer").load("/odd-single.php");
   var refreshId = setInterval(function() {
   $("#responsedcontainer").load("/odd-single.php&randval="+ Math.random());
   }, 3000);
   $.ajaxSetup({ cache: false });
});

これは、3 秒ごとに読み込まれてから更新されます。そのため、更新が発生した後、最後の更新を確認し、td のいずれかの値が変更されているかどうかを確認します。変更されている場合は、2 ～ 3 秒間スタイルを追加します。

私はjavascript/jqueryが初めてなので、しばらくお待ちください。

ありがとう

4

2 に答える 2

0

わかりましたので、このアイデアを思いつきました：

最初に、現在のすべてのテキストを含む配列を取得します(変更前):

$("td#odd").each(function(){
    beforChange.push($(this).text());
});

その後、配列をスキャンして現在の値と比較します。

var i=0;
$("td#odd").each(function(){
    if($(this).text() != beforChange[i]){
         $(this).addClass('updated');
        alert("After:" + $(this).text() + ". Befor:" + beforChange[i]);
         setTimeout( function(){
              $('td.updated').removeClass('updated');

         },2000);
    }
    i++;
});

編集：

私はあなたのためにjsfiddleを作成しました.i ++を入れるのを忘れていたので、今は動作しています:

デモ

それが役に立ったかどうか教えてください。

幸運を。

于 2013-08-01T07:04:39.277 に答える