아래에서는 특정 버튼 클릭을 거부하도록 마우스를 제어하는 JS의 예를 공유하겠습니다. 이는 좋은 참고 가치가 있으며 모든 사람에게 도움이 되기를 바랍니다.
JS 컨트롤 버튼 선택이 금지되어 있습니다
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <script> window.onload=function(){ document.getElementById("s").onmouseover=function(evet){ var _x=this.offsetLeft; var _y=this.offsetTop; var x=Math.random()*180+Math.random()*50; var y=Math.random()*120+Math.random()*50; this.style.position="absolute"; this.style.top=y+'px'; this.style.left=x+'px'; return false; } document.getElementById("s").onclick=function(){ alert("就知道你心里想的和表面做的是相反的!"); document.getElementById("main").style.display="none"; document.getElementById("img").style.display="block"; } document.getElementById("w").onclick=function(){ alert("宝贝:谢谢你的爱!我爱你╮(╯▽╰)╭"); document.getElementById("main").style.display="none"; document.getElementById("img").style.display="block"; } } </script> <style> *{ margin:0; padding:0; } html{ height: 100%; background:url(http://img17.3lian.com/d/file/201702/13/9524e4e08e99e0423f9e9f299e314c72.gif) no-repeat; background-size: cover; } span{ width: 100%; height: 100px; display: block; text-align: center; line-height: 100px; color: #fff; } section{ } section button:nth-child(1){ position: absolute; background: #DE7C2C; left: 100px; border: 0; z-index: 1; } section button:nth-child(2){ position: absolute; z-index: 0; border: 0; background: #DE7C2C; left: 150px; } p{ width:300px; height:200px; background:rgba(34,93,146,.7); border:1px solid #eee; position:absolute; left:0; top: 0; bottom: 0; right: 0; margin: auto; } </style> </head> <body> <p id="main"> <span>亲爱的我爱你,你爱我吗?</span> <section> <button id="s" style="padding:1px 10px;">不</button> <button id="w" style="padding:1px 10px;">爱</button> </section> </p> <p id="img" style=" display:none; width:100%; height:100%; background:url(http://upfile.asqql.com/2009pasdfasdfic2009s305985-ts/2017-8/20178172014060928.gif) no-repeat; background-size:cover;"></p> </body> </html>
위 내용은 제가 모두를 위해 정리한 내용입니다. 앞으로 모든 분들께 도움이 되길 바랍니다.
관련 기사:
자바스크립트에서 이미지의 상위 N개 주요 색상 값을 얻는 방법
성능 향상을 위해 Angular에서 trackBy를 사용하는 방법
플립 카드 게임을 Angular에서 구현하는 방법 WeChat 미니 프로그램
Baidu Maps API를 사용하여 지정된 오버레이를 지우는 방법은 무엇입니까?
WeChat 미니 프로그램에서 애니메이션 구현하는 방법
WeChat 미니 프로그램에서 프로그램에서 사용자 정보를 얻는 방법(자세한 튜토리얼)
위 내용은 JS에서 버튼 클릭을 거부하도록 마우스를 제어하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!