Question

使用Chrome扩展程序并且.On（）回调不会触发，并且点击事件不会按原样附加到元素上。控制台没有显示任何错误，调试显示所有正确的值都传递给初始.On（）调用。不确定是什么绊倒了。

var handlers = {

  'startButton': {
    'parent': 'body',
    'type': 'click',
    'id': '#startButton',
    'needsIf': true,
    'ifCondition': function(){
      return $('#selectSite').val() != 0;
    },
    'elseDo': function(){
      alert("You must select a site to poll");
    },
    'message': {
      'index': 'openTabUrl',
      'value': function(){        
        return $('#selectSite').val();
      }
    }
  },

  'stopButton': {
    'parent': 'body',
    'type': 'click',
    'id': '#stopButton',    
    'needsIf': false,
    'message': {    
      'index': 'closeTab',
      'value': true,
    },
    'action': window.showStartButton  
  }
}

$(document).ready(function(){  
  for (var key in handlers) {
    console.log(key + " -> " + handlers[key].parent);
    $(handlers[key].parent).on(handlers[key].type, handlers[key].id, function(){
      console.log("test during " + key);
      if (handlers[key].needsIf){
        if (handlers[key].ifCondition()){
          chrome.runtime.sendMessage(handlers[key].message);
        } else {    
          handlers[key].elseDo();
        }
      } else {
        chrome.runtime.sendMessage(handlers[key].message);
        if(handlers[key].action){
          handlers[key].action();
        }
      }
      return false;
    });    
  }
});

Answer 1

问题实际上是click处理程序key指向handlers中的最后一个密钥，而不是当前密钥。因此，作为某种解决方法，您可以使用：

Fiddle

$(handlers[key].parent).on(handlers[key].type, handlers[key].id, function() {
    var handler;
    for (var k in handlers)
    {
        if (handlers[k].id == '#' + this.id)
        {
            handler = handlers[k];
            break;
        }
    }
    console.log("test during " + handler.id);
    if (handler.needsIf) {
        if (handler.ifCondition()) {
            chrome.runtime.sendMessage(handler.message);
        } else {    
            handler.elseDo();
        }
    } else {
        chrome.runtime.sendMessage(handler.message);
        if (handler.action) {
            handler.action();
        }
    }
    return false;
});

jQuery .On（）不使用从对象传递的参数触发

1 个答案: