5

まず第一に、私は jQuery ソリューションを探しているのではなく、単純な純粋な Javascript コードを要素内に探しています。

次の html コードがあるとします。

<select onmousedown=" ??? ">...</select>

要素内の単純なスクリプトで、alert()どのボタンが押されたか、ドキュメントに対する要素の相対的な位置を示すポップアップ メッセージを表示するようにします (jQueryの<body>ようなもの)。offset()

4

4 に答える 4

5

何らかの名前で JavaScript 関数を作成し、関数内で使用できるandオブジェクトをonmousedown渡すイベントで呼び出します。eventthis

HTML

<select onmousedown="onMouseDown(event, this)">...</select>

JS

function onMouseDown(e, obj){
   e = e || window.event; //window.event for IE

   alert("Keycode of key pressed: " + (e.keyCode || e.which));
   alert("Offset-X = " + obj.offsetLeft);
   alert("Offset-Y = " + obj.offsetTop);

}

jQueryを使用する予定がある場合は、このスクリプトを使用できます

$('select').mousedown(function(e){
    alert("Keycode of key pressed: " + e.which);

    //Inside the handler this points to the select DOM element
    alert("Offset-X = " + $(this).offset().left);
    alert("Offset-Y = " + $(this).offset().top); 
});

アップデート：

インラインスクリプトが必要な場合は、これを試してください。

<select onmousedown="function(e, obj){ e = e || window.event;alert('Keycode of key pressed: ' + (e.keyCode || e.which));alert('Offset-X = ' + obj.offsetLeft);alert('Offset-Y = ' + obj.offsetTop);}(event, this);">...</select>
于 2012-02-20T01:40:53.193 に答える
3

MouseEvent.button は、ブラウザーごとに異なる値を持ちます

MouseEvent.button == 1// means left key in ie6~ie8
MouseEvent.button == 0// means left key in ie9&others
于 2012-02-20T02:08:55.117 に答える
1

<select id="foo" onmousedown="mouseDown()">...</select>

window.captureEvents(Event.MOUSEDOWN)
window.onmousedown = mouseDown

function mouseDown(e)
{
  xPos = e.screenX;
  yPos = e.screenY;
  alert('onmousedown foo ' + ' x:' + xPos + ' y:'+ yPos);
}

編集

<select id="foo" onmousedown="function mouseDown(e){alert(MouseEvent.button + ' x:' + e.screenX + ' y:'+ e.screenY);}">...</select>

于 2012-02-20T01:16:42.880 に答える
0

編集

先に進む前に、次の記事をお読みください: Javascript Madness: Mouse Events

ドキュメントをクリックすると、多数のプロパティを持つMouseEvent オブジェクトがディスパッチされます。たとえば、 MouseEvent.buttonはどのマウス ボタンが押されたかを示し、MouseEvent.ctrlKeyはクリック時にコントロール キーが押されたかどうかを示します。

ボタンは実際には「左」と「右」ではないことに注意してください。ユーザー設定によって変更できるため、知りたいのは、それがプライマリ ボタンであったかどうかです (通常は左ですが、右である場合もあれば、まったく異なるものである場合もあります)。他のポインティングデバイスから）またはセカンダリボタン（通常は右ですが、何でもかまいません）。

いくつかのプレイ コード:

<script>
function clickDetails(e) {
  e = e || window.event;
  var msg = [];

  for (var p in e) {
    msg.push(p + ': ' + e[p]);
  }
  document.getElementById('msg').innerHTML = msg.join('<br>');
}
    
window.onload = function() {
  document.getElementById('sp0').onmousedown = clickDetails;
}

</script>

<div>
  <span id="sp0">click me</span>
  <br>
  <span id="msg"></span>
</div>

編集

ああ、なんてこった：

<select onmousedown="alert('Button: ' + event.button
                         + '\nPosition: ' + this.offsetLeft 
                         + ',' + this.offsetTop);">
于 2012-02-20T01:53:48.543 に答える