0

この単純な jquery は、ユーザーが特定のキーを押すと、いくつかのテキスト情報を表示します。ユーザーがそのハイパーリンクをクリックした場合に「読み込み中...」というテキストが表示されないことを除いて、それは正常に機能します。

これを解決する方法は、jqueryの初心者です。

jQuery:

$(document).ready(
function () {
    $(document).keydown(
        function(e) {
          var url = false;
          if (e.which == 37) { url = $('.pret a').attr('href'); }
          else if (e.which == 39) { url = $('.sled a').attr('href'); }
           if (url) { $('div.A37-sheet').hide().html('<center><p>Loading...</p></center>').load(window.location = url).fadeIn(); }
        });
  });

HTML 部分:

<li class="pret button" style="left:0; top:50%; position:fixed">
<a class="kggkFX" style="outline: 0;" href="'.$pretlokacija.'"><img src="images/prev.png"></a>
</li>
<li class="sled button" style="right:0; top:50%; position:fixed">
<a class="kggkFX" style="outline: 0;" href="'.$sledlokacija.'"><img src="images/idigore.png"></a>
</li>
4

2 に答える 2

0

clickイベントをキャッチできませんでした。そのため、ユーザーがハイパーリンクをクリックしても何も機能しません。これを追加してください：

$( '.kggkFX' ).click( function( event ){
  event.preventDefault();
  var a = $( event.target ),
      url = a.attr( 'href' ),
      container = $( 'div.A37-sheet' ),
      loader = '<center><p>Loading...</p></center>';
  container.hide().html( loader ).load( window.location = url ).fadeIn();
});

しかし、同じことを繰り返さないようにするには、コードの方が優れています。これで、まったく同じイベント ハンドラーが 2 つできました。すべてのコードを次のように書き直すことをお勧めします。

$(document).ready( function(){
  $( document ).keydown( function( event ) {
        if( e.which == 37 )
          $('.pret a').click();
        else if( e.which == 39 )
          $('.sled a').click();
  });

  $( '.kggkFX' ).click( function( event ){
      event.preventDefault();
      var a = $( event.target ),
          url = a.attr( 'href' ),
          container = $( 'div.A37-sheet' ),
          loader = '<center><p>Loading...</p></center>';
      container.hide().html( loader ).load( window.location = url ).fadeIn();
  });
});
于 2013-05-06T06:10:52.197 に答える