Question

我有以下简化代码：

       $(".button1").click(function() {
          var container = $(this).closest('.someClass');
          container.doStuff();
          specificFunction1();
        });

           $(".button2").click(function() {
          var container = $(this).closest('.someClass');
          container.doStuff();
          specificFunction2();
          specificFunction3();
        });

我可以重构$(this).closest('.someClass');并将其设为全局变量，以便$(this)始终引用正确的按钮吗？

Answer 1

我会：

$(".button1, .button2").on('click', function(){
    $(this).closest('.someClass').doStuff();
});

你需要$(this)，因为它引用了点击的实际按钮，并允许你在按钮本身上链接更多的jQuery函数。

如果您想避免在匿名函数中多次使用$(this)，那么您可以这样做：

$(".button1, .button2").on('click', function(){
    var $this = $(this);

    $this.closest('.someClass').doStuff();

    if($this.hasClass('button1')){
        specificFunction1();
    }
    else if($this.hasClass('button2')){
        specificFunction2();
    }
});

Answer 2

我发现了一个有些意想不到的解决方案，但仍然减少了重复代码，因此它对我有用：

UPDATE CASReport SET [Format Code] = (
     SELECT f.[Format Code] 
     FROM lkup_formatCode f
     INNER JOIN CASReport c
     ON c.Channel = f.Channel AND
     c.Format = f.Format
);

Answer 3

您可以使用call，apply和bind来传递上下文：

完整示例包括：

$('body').append('<button class=button1>tester</button><div class=someClass />')

var $container = function() {
  return $(this).closest('.someClass');
}

$("#tester-btn").click(function() {
  $container.call(this);
});

从多个单击函数中重构$（this）

3 个答案: