web-dev-qa-db-ja.com

DIVにイベントリスナを追加することはできますか？

私はこの機能を知っています：

document.addEventListener('touchstart', function(event) {
    alert(event.touches.length);
}, false);

しかし、これをdivに追加することは可能ですか？例：

document.getElementById("div").addEventListener('touchstart', function(event) {
        alert(event.touches.length);
    }, false);

まだテストしていませんが、機能するかどうか知っている人もいるかもしれません。

javascriptcsseventstouchdom-events
31
Roskvist

ええ、それがあなたのやり方です。

document.getElementById("div").addEventListener("touchstart", touchHandler, false);
document.getElementById("div").addEventListener("touchmove", touchHandler, false);
document.getElementById("div").addEventListener("touchend", touchHandler, false);

function touchHandler(e) {
  if (e.type == "touchstart") {
    alert("You touched the screen!");
  } else if (e.type == "touchmove") {
    alert("You moved your finger!");
  } else if (e.type == "touchend" || e.type == "touchcancel") {
    alert("You removed your finger from the screen!");
  }
}

またはjQueryを使用

$(function(){
  $("#div").bind("touchstart", function (event) {
    alert(event.touches.length);
  });
});
41
iRyanBell

逆にaddEventListenerを使用していない場合は、おそらくIDを制御するための代替手段です。

 $(document).ready(function () {
            $('#container1').on("contextmenu", function (e) {
                e.preventDefault();
            });
        });
0
KiranSolkar