OnsenUI 按钮 DOM 个事件

OnsenUI button DOM events

我最近开始尝试将 OnsenUI 作为移动应用程序 Jquery 的替代品,并且想知道将按钮按下与操作相对应的等效方法是什么。 https://onsen.io/guide/overview.html#EventHandling 似乎暗示组件 DOM 事件部分中有相同的方法。

例如使用 Jquery 我会使用 touchend 事件做一些事情

在 HTML 页面上,我将创建按钮

 <button id="button">Do this</button>

在 app.js 文件中,我会关联要做什么

  $(document).on("touchend", "#button", function(e) {
    e.preventDefault();
    //do some action
    doSomething();
});

温泉试用法

再次创建按钮并使用 onclick 处理程序

<ons-button modifier="material" onclick="doSomething()">
    Start                    
</ons-button>

doSomething() 是 .js 文件中的关联操作,但是之后它变得模糊了。

Onsen UI 作为一个框架并不等同于 jQuery。如果需要,您可以将它与 jQuery Mobile 进行比较。因此,您可以毫无问题地一起使用 Onsen UI 和 jQuery。我个人更喜欢 Vanilla JavaScript 而不是:

<ons-button id="myButton">Do this</ons-button>

document.querySelector('#myButton').onclick = function(event) {
  doSomething();
};

或者:

docment.addEventListener('click', function(event) {
  if (event.target.id === 'myButton'
  doSomething();
});

Onsen UI 2.0 不再依赖 AngularJS 内部,因此您无需担心。