prototypejs - JavaScriptでボタンがクリックされたかどうかを確認する方法

Question

プロトタイプJavaScriptでボタンがクリックされたかどうかを確認する方法は?

$('activateButton').observe('click', function(event) {
  alert(hi);
});

上記のコードは機能しません。

Answer 1

このボタンで:

<button id="mybutton">Click Me</button>

これを使って：

$('mybutton').observe('click', function () {
  alert('Hi');
});

テスト済みで動作します。

document.observe('dom:loaded', function () { })ページが読み込まれる前に実行されるのを防ぐために、それを何かに入れたいと思うかもしれません。

また、単なる説明：

Prototype の 1 つのドル記号は、ID によって要素を選択します。この関数は、イベント ハンドラーを要素にバインドするためのものであるという点で、.observejQuery の関数と非常によく似ています。.on

また、永続的な「ボタンが既にクリックされている」ものにする必要がある場合は、これを試してください：

$('mybutton').observe('click', function () {
  var clicked = true;
  window.clicked = clicked;
});

次に、ボタンがクリックされたかどうかをテストする場合は、次のようにします。

if (clicked) {
  // Button clicked
} else {
  // Button not clicked
}

これは、ユーザーが何度もクリックしたくないフォームを作成しようとしている場合に役立ちます。

参考までに、jQueryでそれを行う方法：

$('#mybutton').on('click', function () {
  alert('Hi');
});

上記の jQuery コードは、次のように短縮することもできます。

$('#mybutton').click(function () {
  alert('Hi');
});

jQuery は、プロトタイプの$と$$関数の使用法を 1 つの関数に結合するという点で、プロトタイプの方が優れてい$ます。これは、id を介して要素を選択できるだけでなく、他の可能な css 選択方法によっても要素を選択できます。

プレーンな JavaScript でそれを行う方法:

document.getElementById('mybutton').onclick = function () {
  alert('Hi');
}

必要な場合に備えて、完全な参照用に。

Answer 2

$('body').delegate('.activateButton', 'click', function(e){
  alert('HI');
});