1

IDがクリックされた回数を計算するためにjQueryを実行しようとしています。たとえば、＃kwick_1が1回クリックされた場合、ビデオをロードする必要があります。「else」は何もしません。

そして、これを関数全体に適用することを検討しているので、2、3、4などにも同じことが言えます。

どうすればこれを達成できますか？

var timesClicked = 0;
  $('#kwick_1, #kwick_2, #kwick_3, #kwick_4, #kwick_5, #kwick_6, #kwick_7').bind('click', function(event){
   var video = $(this).find('a').attr('href'); /* bunny.mp4 */

   var clickedID = $(this).attr('id'); /* kwick_1 */
   var vid = 'vid';
   timesClicked++;

   $(this).removeAttr('id').removeAttr('class').attr('id',clickedID + vid).attr('class',clickedID + vid);
   if(timesClicked == 1) {

    $.get("video.php", { video: video, poster: 'bunny.jpg', }, function(data){
     $('.'+clickedID+vid).html(data);
    }); 

   } else {
    /* Do nothing for now */
   }
   return false;
  });
4

1 に答える 1

4

.one()次のように、これを少し簡単に行うために使用できます。

$('#kwick_1, #kwick_2, #kwick_3, #kwick_4, #kwick_5, #kwick_6, #kwick_7').one('click', function(event){
  var video = $(this).find('a').attr('href'), clicked = this.id + 'vid';

  $(this).attr({ id: clicked, 'class': clicked });
  $.get("video.php", { video: video, poster: 'bunny.jpg', }, function(data){
    $('.'+clicked).html(data);
  }); 
}).click(function() { return false; });

残りは最適化と繰り返しコードの削減ですが、アイデアは、 を使用して一度だけ発生させたい部分をバインドすること.one()であり、そのハンドラーは最初の実行後にそれ自体を削除します。次に、それが常に発生する必要があるため、 return falseusing をバインドします。イベント ハンドラーはバインドされた順序で実行されるため、これが上記の例のようにバインドされていることを確認してください。.click()

また、セレクターをすべてのクラスに割り当てることができれば、#kwick_1, #kwick_2....セレクターを置き換えることもできます。これは上記の方法でも機能し、保守がはるかに簡単になります。.kwick

于 2010-10-08T09:22:53.413 に答える