control-freak-ide/Control-Freak-Documentation/jQuery/docs/entries/mouseup.json
plastic-hub-dev-node-saturn 538369cff7 latest
2021-05-12 18:35:18 +02:00

1 line
2.7 KiB
JSON

{"name":"mouseup","type":"method","title":".mouseup()","deprecated":null,"removed":null,"desc":"Bind an event handler to the \"mouseup\" JavaScript event, or trigger that event on an element.","categories":["events/mouse-events","version/1.0","version/1.4.3"],"entries":[{"return":"jQuery","signatures":[{"added":"1.0","argument":{"desc":"A function to execute each time the event is triggered.","name":"handler(eventObject)","type":"Function"}},{"added":"1.4.3","argument":[{"desc":"An object containing data that will be passed to the event handler.","name":"eventData","type":"PlainObject","optional":"true"},{"desc":"A function to execute each time the event is triggered.","name":"handler(eventObject)","type":"Function"}]},{"added":"1.0"}],"examples":{"desc":"Show texts when mouseup and mousedown event triggering.","code":"\n$( \"p\" )\n .mouseup(function() {\n $( this ).append( \"<span style='color:#f00;'>Mouse up.</span>\" );\n })\n .mousedown(function() {\n $( this ).append( \"<span style='color:#00f;'>Mouse down.</span>\" );\n });\n","html":"\n<p>Press mouse and release here.</p>\n"},"longdesc":"\n <p>This method is a shortcut for <code>.on('mouseup', handler)</code> in the first variation, and <code>.trigger('mouseup')</code> in the second.</p>\n <p>The <code>mouseup</code> event is sent to an element when the mouse pointer is over the element, and the mouse button is released. Any HTML element can receive this event.</p>\n <p>For example, consider the HTML:</p>\n <pre><code>\n&lt;div id=\"target\"&gt;\n Click here\n&lt;/div&gt;\n&lt;div id=\"other\"&gt;\n Trigger the handler\n&lt;/div&gt;\n</code></pre>\n <p class=\"image\">\n <img src=\"/resources/0042_05_02.png\" alt=\"\"/>\n </p>\n <p>The event handler can be bound to any <code>&lt;div&gt;</code>:</p>\n <pre><code>\n$( \"#target\" ).mouseup(function() {\n alert( \"Handler for .mouseup() called.\" );\n});\n </code></pre>\n <p>Now if we click on this element, the alert is displayed:</p>\n <p>\n <samp>Handler for .mouseup() called.</samp>\n </p>\n <p>We can also trigger the event when a different element is clicked:</p>\n <pre><code>\n$( \"#other\" ).click(function() {\n $( \"#target\" ).mouseup();\n});\n </code></pre>\n <p>After this code executes, clicks on <samp>Trigger the handler</samp> will also alert the message.</p>\n <p>If the user clicks outside an element, drags onto it, and releases the button, this is still counted as a <code>mouseup</code> event. This sequence of actions is not treated as a button press in most user interfaces, so it is usually better to use the <code>click</code> event unless we know that the <code>mouseup</code> event is preferable for a particular situation.</p>\n "}]}