javascript - 将多个 javascript var 合并到一个函数中

Question

我对 js 一无所知，但我偶然发现了这一点，想知道是否有人可以帮助我将这两者合而为一。我最终可能会拥有大约 30 个。是否可以将所有 30 个变量组合在一起？每个customPush都会推送一个新的html。

谢谢。

var customPush1 = function (event) {
myNavigator.pushPage('pageNav2.html', { data: { cardTitle: 
event.target.textContent } })
};
var customPush2 = function (event) {
myNavigator.pushPage('pageNav3.html', { data: { cardTitle: event.target.textContent } })
};

Answer 1

yes. the plan is to have 30 buttons loading a separate html each

在这种情况下，我会采用不同的方式，而不是创建大量函数，而是向按钮添加一些数据属性，并使用委托(delegate)事件。

但是如果你想让它可以在函数之间共享代码。您可以创建一个返回函数的函数，并使用闭包来传递参数。下面是一个例子。

function makePush(url) {
  return function (event) {
    myNavigator.pushPage(url, { data: { cardTitle: 
      event.target.textContent } })
  }
}

var 
  customPush1 = makePush('pageNav2.html'),
  customPush2 = makePush('pageNav3.html');

这是在按钮上使用委托(delegate)事件的示例。它使用 jQuery，因为我发现它快速且简单，但无需 jQuery 也可以完成相同的操作。

$('body').on('click', '[data-custom-push]', function () {
  var page = $(this).attr('data-custom-push');
  alert('Page = ' + page);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button data-custom-push="pageNav1.html">Button 1</button> <br>
<button data-custom-push="pageNav2.html">Button 2</button> <br>
<button data-custom-push="pageNav3.html">Button 3</button> <br>
<button data-custom-push="pageNav4.html">Button 4</button> <br>
<button data-custom-push="pageNav5.html">Button 5</button> <br>
<button data-custom-push="xyz.html">Button 6</button> <br>
<button data-custom-push="abc.html">Button 7</button> <br>