jQuery.appearは、ユーザーに表示されている間にスクリプトを実行します

要素が消えるまで表示されたときに、このスクリプトを使用して毎秒コマンドを実行します。 https://github.com/morr/jquery.appear jQuery.appearは、ユーザーに表示されている間にスクリプトを実行します

しかし、私はマニュアルが不足していて、この例も私を助けません。

ページから：

$('someselector').appear(); // It supports optinal hash with "force_process" and "interval" keys. Check source code for details.

私は、これは、このための右のコードの断片であることだと思いますか？

私の目標は、そのIDが見えるようになるとすぐ素子のソースを交換することです。

$.get('https://localhost/LightRoom1.php', function(data) { $('#LightRoom1').prop('src', data); });

これは、＃LightRoom1が表示されると毎秒行う必要があり、表示されていないときに停止する必要があります。

*＃ライトで始まる複数の要素があります。 idはパスとidセレクターにも渡されなければなりません。

ご協力いただきありがとうございます、ありがとうございます。

出典

2016-11-15 davinci

ドキュメントhttp://morr.github.io/appear.html – madalinivascu

はい、残念ながら私は自分のニーズに合わせてそれを変更することができませんでした。 – davinci

これは何か？

var $myDiv = $('#LightRoom'); 

// Bind handler for the 'appear' event 
$myDiv.on('appear', function() { 
    // element appeared, execute your code 
}); 

// Bind handler for the 'disappear' event 
$myDiv.on('disappear', function() { 
    // element disappeared, execute your code 
});

これが役に立ちます。

出典

2016-11-15 08:21:44 JasonK

私はあなたのイベントリスナを使用しなければならないと思う： "Lightroomの" で始まる任意のIDを選択することが

$('someselector').on('appear', function(event, $all_appeared_elements) { 
    // this element is now inside browser viewport 
}); 
$('someselector').on('disappear', function(event, $all_disappeared_elements) { 
    // this element is now outside browser viewport 
});

や、などjqueryのワイルドカードセレクター "[ID^=のLightroom]"を。は、その後、あなたは、このコードはあなたを助けることができるかどうかの要素がてclearInterval（）

チェックを使用して消滅したときにn秒ごとにあなたのコードを繰り返し、それをクリアするにはjavascript関数たsetInterval（）と間隔を設定する必要があります。

var intervals = []; 
$("[id^=LightRoom]").on('appear', function(event, $all_appeared_elements) { 
// create an interval to repeat action every 1 second 
// and store it inside interval array using id as key 
var appeared = $(this).attr("id"); 
intervals[appeared] = setInterval(function(){ 
          $.get('https://localhost/" + appeared + ".php', function(data) { 
           $(appeared).prop('src', data); 
          }); 
         }, 1000); 
}); 

$("[id^=LightRoom]").on('disappear', function(event, $all_disappeared_elements) { 
// delete intervals for non-visible elements 
    var disappeared = $(this).attr("id"); 
    clearInterval(intervals[disappeared]); 
});

出典

2016-11-15 08:41:42

ありがとう、それは有望そうです。しかし、それはまだ動作しません。私はあなたのコードを私のjsに追加しました。私は他の何かを変えなければなりませんか？ – davinci

Hmパスに現れた変数は使用できません。手動で設定した場合は動作します。文字列は正しいですが... – davinci

setInterval関数内に "出現した"値があるかどうかを確認してください。未定義の場合は、前のコードを変更して、関数パラメータとして「出現」を渡すことができるようにする必要があります。ここでいくつかのヒントを見つけることができます：[リンク]（http://stackoverflow.com/questions/15410384/javascript-setinterval-function-with-arguments） –

<!DOCTYPE html> 
 
<html> 
 
    <head> 
 
    </head> 
 
    <body> 
 
     
 
     
 
     <br><br><br><br><br><br><br><br><br><br><br><br><br> 
 
     <br><br><br><br><br><br><br><br><br><br><br><br><br> 
 
     <br><br><br><br><br><br><br><br><br><br><br><br><br> 
 
     <br><br><br><br><br><br><br><br><br><br><br><br><br> 
 
     <br><br><br><br><br><br><br><br><br><br><br><br><br> 
 
     <br><br><br><br><br><br><br><br><br><br><br><br><br> 
 
     <br><br><br><br><br><br><br><br><br><br><br><br><br> 
 
     <img src="images/licht_off.png" align="center" id="LichtStatus" style="height:10vh"> 
 

 

 
     <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery.appear/0.3.3/jquery.appear.min.js"></script> 
 
     <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
 
     
 
     <script> 
 
      var intervals = []; 
 
      $("[id^=Licht]").on('appear', function(event, $all_appeared_elements) 
 
      { 
 
      // create an interval to repeat action every 1 second 
 
      // and store it inside interval array using id as key 
 
      var appeared = $(this).attr("id"); 
 
      intervals[appeared] = setInterval(function() 
 
      { 
 
       $.get('https://localhost/" + appeared + ".php', function(data) 
 
       { 
 
       $(appeared).prop('src', data); 
 
       }); 
 
       }, 1000); 
 
      }); 
 

 
       $("[id^=Licht]").on('disappear', function(event, $all_disappeared_elements) 
 
       { 
 
       // delete intervals for non-visible elements 
 
       var disappeared = $(this).attr("id"); 
 
       clearInterval(intervals[disappeared]); 
 
       }); 
 
     </script> 
 

 
    </body> 
 
</html>

私は、下にスクロールすると、それは、cべきソースを縛るが、何も起こらない。

任意のアイデア（LichtStatus.phpは、実際に画像/ licht.pngを応答しますか）？

出典

2016-11-15 14:45:32 davinci

jQuery.appearは、ユーザーに表示されている間にスクリプトを実行します

答えて

関連する問題