1

背景

我正在尝试创建一个 jquery 函数，它将更改所有类名，除了当前有问题的对象，执行一个函数，然后动态地重置所有旧类，无需刷新......有人知道我怎么能做到这一点吗？

HTML

<div class="view_link">
    <a href="#" class="edit_link" data-link="edit_input_a">Edit</a>
    <span class="edit_input_a"><input type='text' name='input' /></span>
</div>        
<div class="view_link">
    <a href="#" class="edit_link" data-link="edit_input_z">Edit</a>
    <span class="edit_input_z"><input type='text' name='input' /></span>
</div>
<div class="view_link">
    <a href="#" class="edit_link" data-link="edit_input_9">Edit</a>
    <span class="edit_input_9"><input type='text' name='input' /></span>
</div>

Javascript

$('.edit_link').click(function(e) {
    //set which fields to act upon
    var edit_field = $(this).data('link');
    //Open the editable field of the corresponding item
    $("." + edit_field).slideDown(700,'linear');

    /* now change all the other a links with class 'edit_link' to edit_link_inactive (EXCEPT THE CURRENT OBJECT BEING WORKED ON) so if the user clicks another link at the same time, it will not run through the click function */

   //Run Ajax Function

   /* On succeed, reset all classes with 'edit_link_inactive' back to edit_link */

我尝试过的非工作声明

$('.edit_link').not(this).attr('class', "inactive");

谢谢！！！

4

1 回答 1

1

稍后更改类不会删除已附加到元素的事件处理程序，您需要为此使用off()：

$('.edit_link').on('click', doStuff);

function doStuff(e) {
    var edit_field = $(this).data('link');
    $("." + edit_field).slideDown(700,'linear');
    ....

    $('.edit_link').not(this).off('click', doStuff);

    $.ajax({
        ......
    }).always(function() {
         $('.edit_link').on('click', doStuff);
    })
}
于 2013-04-29T20:59:13.783 回答