页面导航 SammyJS 上的事件侦听器重复

Question

我正在使用SammyJS 框架进行路由。

正如我的标题所示，我的网页上的事件侦听器存在问题。在我的代码中，我有 4 个主页，客户端/传感器/仪表板/状态。在传感器页面上，它加载了许多不同的传感器。除了能够编辑传感器元数据外，还有一个按钮可以将所有者添加到传感器。页面和按钮的 HTML 仅在进入编辑页面时加载。看起来像这样 这是 Javascript 的精简版...

(function() {
  var app = Sammy.apps.body;

  app.get('#/sensors', function(context) {
    //context.render the index page...
  });

  app.get('#/sensors/edit/:sensor', function(context) {
    context.render('/views/sensors/edit.html', function(view) {
      $('#result').html(view);

      $(document).on('click', '#addCustomer', function() {
        //Add another dropdown customer list...
      });
      
      //More event listeners...
    })
  })
})();

发生的情况是，如果我离开该页面，然后返回该页面（不必是相同的传感器编辑页面），然后单击 ADD CUSTOMER，它会添加两个。每次我离开然后返回时，它都会在它添加的下拉列表的数量上增加 1。我的第一个想法是事件侦听器以某种方式被复制，但我不知道如何测试。非常感谢任何帮助。

Answer 1

看看 jQuery "one" 方法，它可以确保事件处理程序只绑定一次：http://api.jquery.com/one/

$("#addCustomer").one("click", function(event) {
   //Add another dropdown customer list...
});