[{"data":1,"prerenderedAt":244},["ShallowReactive",2],{"post:ignore-right-click-in-mousedown-event-handler":3},{"id":4,"title":5,"body":6,"date":231,"description":232,"draft":233,"extension":234,"meta":235,"navigation":236,"path":237,"seo":238,"stem":239,"tags":240,"__hash__":243},"posts\u002Fposts\u002Fignore-right-click-in-mousedown-event-handler.md","TIL: Ignore Right-click Events in a `mousedown` Event Handler",{"type":7,"value":8,"toc":229},"minimark",[9,18,61,64,111,114,135,222,225],[10,11,12,13,17],"p",{},"Making a \"Print page\" button. You know the drill. Use ",[14,15,16],"code",{},"addEventListener()",", pass a callback function.",[19,20,25],"pre",{"className":21,"code":22,"language":23,"meta":24,"style":24},"language-js shiki shiki-themes github-light github-dark","document.getElementById(\"btnPrint\").addEventListener(\"mousedown\",printWindow);\n","js","",[14,26,27],{"__ignoreMap":24},[28,29,32,36,40,43,47,50,53,55,58],"span",{"class":30,"line":31},"line",1,[28,33,35],{"class":34},"sVt8B","document.",[28,37,39],{"class":38},"sScJk","getElementById",[28,41,42],{"class":34},"(",[28,44,46],{"class":45},"sZZnC","\"btnPrint\"",[28,48,49],{"class":34},").",[28,51,52],{"class":38},"addEventListener",[28,54,42],{"class":34},[28,56,57],{"class":45},"\"mousedown\"",[28,59,60],{"class":34},",printWindow);\n",[10,62,63],{},"Here's my event handler:",[19,65,67],{"className":21,"code":66,"language":23,"meta":24,"style":24},"var printWindow = function(e) {\n    window.print();\n};\n",[14,68,69,93,105],{"__ignoreMap":24},[28,70,71,75,78,81,84,86,90],{"class":30,"line":31},[28,72,74],{"class":73},"szBVR","var",[28,76,77],{"class":38}," printWindow",[28,79,80],{"class":73}," =",[28,82,83],{"class":73}," function",[28,85,42],{"class":34},[28,87,89],{"class":88},"s4XuR","e",[28,91,92],{"class":34},") {\n",[28,94,96,99,102],{"class":30,"line":95},2,[28,97,98],{"class":34},"    window.",[28,100,101],{"class":38},"print",[28,103,104],{"class":34},"();\n",[28,106,108],{"class":30,"line":107},3,[28,109,110],{"class":34},"};\n",[10,112,113],{},"Once I right-clicked on the button to inspect it, I realized it would be nice to NOT open the print dialog if the user right-clicks on it for some\u002Fany reason. This would make more sense for a larger element, but whatever.",[10,115,116,117,124,125,134],{},"Here's my ubiquitous, ",[118,119,123],"a",{"href":120,"rel":121},"https:\u002F\u002Fstackoverflow.com\u002Fa\u002F9521965",[122],"nofollow","ever-so-relevant Stack Overflow answer by FriendlyGuy",", and the slightly more referential ",[118,126,129,130,133],{"href":127,"rel":128},"https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FMouseEvent\u002Fbutton",[122],"MDN post describing the ",[14,131,132],{},"MouseEvent.button"," event handler parameter",".",[19,136,138],{"className":21,"code":137,"language":23,"meta":24,"style":24},"var printWindow = function(e) {\n    var isLeftMouseButton = function() { return e.button === 0; };\n    if ( isLeftMouseButton() ) {\n        window.print();\n    }\n};\n",[14,139,140,156,187,201,211,217],{"__ignoreMap":24},[28,141,142,144,146,148,150,152,154],{"class":30,"line":31},[28,143,74],{"class":73},[28,145,77],{"class":38},[28,147,80],{"class":73},[28,149,83],{"class":73},[28,151,42],{"class":34},[28,153,89],{"class":88},[28,155,92],{"class":34},[28,157,158,161,164,166,168,171,174,177,180,184],{"class":30,"line":95},[28,159,160],{"class":73},"    var",[28,162,163],{"class":38}," isLeftMouseButton",[28,165,80],{"class":73},[28,167,83],{"class":73},[28,169,170],{"class":34},"() { ",[28,172,173],{"class":73},"return",[28,175,176],{"class":34}," e.button ",[28,178,179],{"class":73},"===",[28,181,183],{"class":182},"sj4cs"," 0",[28,185,186],{"class":34},"; };\n",[28,188,189,192,195,198],{"class":30,"line":107},[28,190,191],{"class":73},"    if",[28,193,194],{"class":34}," ( ",[28,196,197],{"class":38},"isLeftMouseButton",[28,199,200],{"class":34},"() ) {\n",[28,202,204,207,209],{"class":30,"line":203},4,[28,205,206],{"class":34},"        window.",[28,208,101],{"class":38},[28,210,104],{"class":34},[28,212,214],{"class":30,"line":213},5,[28,215,216],{"class":34},"    }\n",[28,218,220],{"class":30,"line":219},6,[28,221,110],{"class":34},[10,223,224],{},"Ta-da!",[226,227,228],"style",{},"html pre.shiki code .sVt8B, html code.shiki .sVt8B{--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .sScJk, html code.shiki .sScJk{--shiki-default:#6F42C1;--shiki-dark:#B392F0}html pre.shiki code .sZZnC, html code.shiki .sZZnC{--shiki-default:#032F62;--shiki-dark:#9ECBFF}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .szBVR, html code.shiki .szBVR{--shiki-default:#D73A49;--shiki-dark:#F97583}html pre.shiki code .s4XuR, html code.shiki .s4XuR{--shiki-default:#E36209;--shiki-dark:#FFAB70}html pre.shiki code .sj4cs, html code.shiki .sj4cs{--shiki-default:#005CC5;--shiki-dark:#79B8FF}",{"title":24,"searchDepth":95,"depth":95,"links":230},[],"2018-05-03T10:39:17-04:00","Making a \"Print page\" button. You know the drill. Use addEventListener(), pass a callback function.",false,"md",{},true,"\u002Fposts\u002Fignore-right-click-in-mousedown-event-handler",{"title":5,"description":232},"posts\u002Fignore-right-click-in-mousedown-event-handler",[241,242],"javascript","til","r3DnjwE3b45S3Ob4GVqfz5KdVqCRAoQ3qQ3Xipa9lbY",1790471528201]