Question

当用户按某些键时，这个简单的jquery会显示一些文本信息。它的工作正常，但如果用户点击该超链接，则不会显示文本“正在加载...”。

如何解决这个问题，是jquery中的总noob。

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>

Answer 1

你没有抓住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();
});

但是当你试图不重复时，代码会更好。现在我们有两个非常相同的事件处理程序。好的做法是将所有代码重写为：

$(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();
  });
});

Answer 2

我认为这需要延迟。

可以在此时设置超时或其他内容。

需要点击这个jquery的帐户

2 个答案: