javascript - jQuery:在 ajax 事件后禁用链接的代码遇到问题

标签 javascript jquery ajax

目标: 在收到 ajax:success 之前禁用链接。 (然后我会告诉我的应用程序服务器启用链接。我正在编写一个简单的棋盘游戏,并且不想在第一个请求得到响应之前接收多个ajax请求,因为它会扰乱游戏逻辑.

  <script type="text/javascript">
      var disableLinks = false;

  $("a").click(function(e){
    if (disableLinks){
      e.preventDefault();
    }
  });


  $("a").ajaxStart(function(){
    disableLinks = true;
  });

    $("a").ajaxStop(function(){
    disableLinks = false;
  });


</script>

链接如下:

<a href="/board/take_turn?id=313&x=1&y=2" data-remote="true">
              <div class="ttt_square"> 
                &nbsp;
              </div>
</a>

最佳答案

这是因为您的 AJAX 开始和结束事件永远不会触发。为什么?因为简单地单击链接并不是 AJAX 请求,并且不会触发全局 AJAX 事件。要使用全局 AJAX 事件,您需要使用 AJAX 函数,例如 .get( )、.load( ) 或 $.ajax( )

下面的代码大部分是您的...我刚刚添加了 2 行(甚至可以减少到 1 行,但我认为这样看起来更好)

var disableLinks = true;

$('a').click( function( e )
{
    if( disableLinks )
    {
        e.preventDefault( );
    }

    var self = $(this);
    $.ajax( { "url": self.attr( 'href' ) } );
} );


$('a').ajaxStart( function( )
{
    disableLinks = true;
} );

$('a').ajaxStop( function( )
{
    disableLinks = false;
} );

关于javascript - jQuery:在 ajax 事件后禁用链接的代码遇到问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4868495/

相关文章:

javascript - .ajax 将远程页面内容加载到 javascript var

javascript - 在运行时向 Angular 2 中的 DOM 添加新的组件元素不会呈现组件

javascript - 如何在 React 函数组件中调用 API?

jQuery - 添加/删除表单中的输入字段

jquery - $.ajax() 只获取正文

javascript - 使用 ajax 的动态内容(ruby on rails)

javascript - Bokeh 嵌入在 Flask 中不起作用(Bokeh 未定义)

javascript - 需要帮助理解 mongodb 聚合 $cond 的 for 循环

javascript - jQuery - 将组合添加到字符串中,并对表单的许多输入字段重复此操作

javascript - event.shiftKey 在调试器中工作但不是全速