将多个javascript var组合成一个函数

时间:2017-08-30 22:40:49

标签: javascript onsen-ui

我对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 } })
};

1 个答案:

答案 0 :(得分:1)

  

是肯定的。计划是有30个按钮加载一个单独的html

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

但是如果你想这样做,你可以在功能之间共享代码。您可以创建一个返回函数的函数,并使用闭包来传递参数。以下是一个例子。

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

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

这是一个在按钮上使用委托事件的示例。它使用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>

相关问题