jQuery引用(这个)不起作用吗？

Question

我有一个带有文本的href链接-- "attivo“或”“。

用户可以使用ajax请求$.post()将数据库中的项设置为“活动”或“关闭”。

对于这些问题，我有两个问题：

1. 我无法让对$(这个)的引用工作起来。我尝试了一个普通的链接，它可以工作，但没有封装在if/
2. 中？？
3. 如何防止用户在链接上单击多次并提交几个请求？这是否合理的考虑呢？我需要一个小计时器什么的吗？

首先，我在想一条javascript确认消息，但这对这个函数来说很烦人..

HTML：

<dl id='album-list'>
<dt id="dt-2">some title</dt>
<dd id="dd-2">
    some description<br />
    <div class='links-right'>status: <a class='toggle-active' href='#'>non attivo</a></div>
</dd>
</dl>

<a class="test" href="#">test</a>

联署材料：

        $('dd a.toggle-active').click(function() {
            var a_ref = $(this);
            var id = a_ref.parent().parent().attr('id').substring(3);
            if (a_ref.text() == "non attivo") {
                var new_active = "active"; // for db in english
                $.post("ajax-aa.php", {album_id:id, album_active:new_active},
                function(data) {
                    // alert("success");
                    a_ref.text("non attivo"); // change href text
                });
            } else {                
                var new_active = "closed"; // for db in english
                $.post("ajax-aa.php", {album_id:id, album_active:new_active},
                function(data) {
                    // alert("success");
                    a_ref.text("attivo"); // change href text
                });
            }
            return false;
        });     

        $('a.test').click(function() {
            var a_ref = $(this);
            $.post("ajax-aa.php", {album_id:2, album_active:"active"},
            function(data) {
                a_ref.text("changed");
            });
            return false;
        })

Answer 1

$(this)应该引用if/ but中的a元素，而不是回调函数中的元素。回调函数在不同的上下文中运行，因此在回调函数中运行。

    function(date) { }

this不引用a元素。回调函数中的this与回调函数外的this不一样。因为回调函数是闭包，所以它将保持对局部变量a_ref的引用。

若要防止用户单击两次，请向元素中添加类。

  $(this).addClass("hasbeenclicked")

在单击处理程序中，检查是否设置了此选项，并在有以下情况时不执行任何操作：

  if ( ! $(this).is(".hasbeenclicked") ) {
  ....
  }

Answer 2

停止用户多次单击链接的最简单方法是在用户单击链接时向链接添加类或其他内容。

a_ref.addClass('in-progress');

然后在AJAX请求完成后删除该类。

a_ref.removeClass('in-progress');

当用户第一次单击该链接时，请检查请求是否正在进行；

if (a_ref.hasClass('in-progress')) {
    return'
};

编辑:一个更详细的例子：

$('a.test').click(function() {
    var a_ref = $(this);


    if (a_ref.hasClass('in-progress')) {
        return false;
    } else {
        a_ref.addClass('in-progress');
    }

    $.post("ajax-aa.php", {album_id:2, album_active:"active"},
    function(data) {
        a_ref.text("changed").removeClass('in-progress');
    });

    return false;
})