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 内部,因此您无需担心。
我最近开始尝试将 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 内部,因此您无需担心。