Javascript jquery单击事件

我有一些jquery，看起来像这样

    $('.career_select .selectitems').click(function(){
    var selectedCareer = $(this).attr('title');
    $.ajax({
        type: 'POST',
        url: '/roadmap/step_two',
        data: 'career_choice='+selectedCareer+"&ajax=true&submit_career=Next",
        success: function(html){
            $('.hfeed').append(html);
            $('#grade_choice').SelectCustomizer();
          }
    });
});

我的问题是，如果用户不断单击，那么.hfeed会不断获得附加到它的数据。如何将其限制为只能单击一次？

使用该功能：

将处理程序附加到元素的事件。每个元素最多执行一次处理程序

如果希望只单击元素一次，然后在请求完成后重新启用该元素，则可以：

A） 保留一个状态变量，该变量在请求当前正在进行时更新，如果正在进行，则在事件顶部退出。
B） 使用

one

，将代码放入函数中，并在请求完成后重新绑定

第二个选项如下所示：

function myClickEvent() {
    var selectedCareer = $(this).attr('title');
    var that = this;

    $.ajax({
        type: 'POST',
        url: '/roadmap/step_two',
        data: 'career_choice='+selectedCareer+"&ajax=true&submit_career=Next",
        success: function(html){
            $('.hfeed').append(html);
            $('#grade_choice').SelectCustomizer();
        },
        complete: function() {
            $(that).one('click', myClickEvent);
        }
    });
}

$('.career_select .selectitems').one('click', myClickEvent);

---

您可以使用全局变量，如

var added = false;
$('.career_select .selectitems').click(function(){
    if(!added) {
        // previous code here
        added = true;
    }
});

---

或者使用

.one（“click”，function（）{…}）

而不是前面的click函数，每个元素最多执行一次处理程序。有关更多详细信息，请参阅。

我还想提及

$。ajax

可以在发送之前提供

，
完成
回调以处理禁用/隐藏控件，并提供比
.one（）
更好的错误恢复。@Paulo您能给我一个答案B的示例吗？