Question

我有一个保存/编辑按钮。我希望它能做不同的事情，具体取决于它当前是保存按钮还是编辑按钮。为清楚起见，我想将jQuery选择器和函数保存到变量名，然后调用它：

    $('div#' + id + ' .edit').click(function(){

        var i = this;
        var state = function(st){
            if( typeof st !== 'undefined')
                $(i).html(st);
            else
                return $(i).html();
        };

        if( state() == 'Edit' ) {
            controller.edit(id);
            state('Save');
        } else {
            controller.save();
            state('Edit');
        }

    });

我的问题：有更快的方法吗？如下所示：

    $('div#' + id + ' .edit').click(function(){

        var state = $(this).html;

        if( state() == 'Edit' ) {
            controller.edit(id);
            state('Save');
        } else {
            controller.save();
            state('Edit');
        }

    });

......但这不起作用。

这个例子只是一个例子;我知道有很多方法可以在不将选择器和函数保存到变量的情况下完成它所做的事情。尽管如此，问题仍然存在：是否有可能更快地完成这项工作？

Answer 1

为什么不

$('#' + id + ' .edit').on('click', function(){
    $(this).text(function(_, txt) {
        if (txt == 'Edit') {
            controller.edit(id);
            return 'Save';
        } else if (txt == 'Save') {
            controller.save();
            return 'Edit';
        }
    });
});

Answer 2

jQuery元素是对象，所以为什么不直接存储到你的Object元素所需的状态：

<强> DEMO

$('div#' + id + ' .edit').click(function(){
  var es = this.es ^= 1;           // Toggle/Store state
  $(this).text(es?'Save':'Edit');
  return controller[es?'edit':'save'](id);
});

将jQuery选择器和函数保存到变量

2 个答案: