.mouseup()【《マウスボタンアップ》イベントハンドラ設定・実行】

メモ

構文

説明構文戻り値
《マウスボタンアップ》
イベントハンドラ設定 		.mouseup( handler ) 1.0

handler：イベントハンドラ
引数説明
[ Event eventObject ]イベントオブジェクト
(this)該当要素 (HTML5：基本DOM要素 参照)
戻り値説明
false
その他 		.on()【イベントハンドラ設定】のイベントのバブルアップ・処理抑止 参照
処理続行

.on( "mouseup", handler ) の省略形 		jQuery
.mouseup( [eventData ], handler ) 1.4.3

Anything eventData：イベントデータ
handler：イベントハンドラ
引数説明
[ Event eventObject ]イベントオブジェクト
(イベントデータは、eventObject.data で参照)
(this)該当要素 (HTML5：基本DOM要素 参照)
戻り値説明
false
その他 		.on()【イベントハンドラ設定】のイベントのバブルアップ・処理抑止 参照
処理続行

.on( "mouseup", handler ) の省略形 		jQuery
《マウスボタンアップ》
イベントハンドラ実行 		.mouseup() 1.0

.trigger( "mouseup" ) の省略形 		jQuery

関連

例

《マウスボタンアップ》イベントハンドラ設定・実行

<style>
.borderMouseup1 {
  border:1px red solid; padding:1px 5px; margin-right:5px; width:400px;
  cursor:pointer;
}
</style>

<p id="mouseup11" class="borderMouseup1">[ mouseup11 ]<br>.mouseup( handler )</p>
<p id="mouseup12" class="borderMouseup1">[ mouseup12 ]<br>.mouseup( "DATA", handler )</p>
<p id="mouseup13" class="borderMouseup1">[ mouseup13 ]<br>.mouseup( { "DATA1", "DATA2" }, handler )</p>
<p>
  <button id="buttonMouseup11">[ buttonMouseup11 ]<br>$("#mouseup11").mouseup()</button>
  <button id="buttonMouseup12">[ buttonMouseup12 ]<br>$("#mouseup12").mouseup()</button>
  <button id="buttonMouseup13">[ buttonMouseup13 ]<br>$("#mouseup13").mouseup()</button>
</p>
<p>
  <span id="outputMouseup1" style="border:1px black solid; padding:1px 5px; background-color:lightcyan;">【出力】</span>
</p>

<script>
function funcMousedown(eventObject) {
  $("#outputMouseup1").text("[ " + this.id + " ] mousedown");
}

$("#mouseup11")
  .mouseup(function(eventObject) {
    var text = "[ " + this.id + " ] mouseup";
    $("#outputMouseup1").text(text);
  })
  .mousedown(funcMousedown);

$("#mouseup12")
  .mouseup("DATA", function(eventObject) {
    var text = "[ " + this.id + " ] mouseup ( " + eventObject.data + " )";
    $("#outputMouseup1").text(text);
  })
  .mousedown(funcMousedown);

$("#mouseup13")
  .mouseup({ data1:"DATA1", data2:"DATA2" }, function(eventObject) {
    var text = "[ " + this.id + " ] mouseup ( " + eventObject.data.data1
      + ", " + eventObject.data.data2 + " )";
    $("#outputMouseup1").text(text);
  })
  .mousedown(funcMousedown);

$("#buttonMouseup11").click(function() {
  $("#mouseup11").mouseup();
});

$("#buttonMouseup12").click(function() {
  $("#mouseup12").mouseup();
});

$("#buttonMouseup13").click(function() {
  $("#mouseup13").mouseup();
});
</script>

[ mouseup11 ]
.mouseup( handler )

[ mouseup12 ]
.mouseup( "DATA", handler )

[ mouseup13 ]
.mouseup( { "DATA1", "DATA2" }, handler )

【出力】