下面小编就为大家分享一篇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() 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; } div{ 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> <div> <span>亲爱的我爱你，你爱我吗？</span> <section> <button>不</button> <button>爱</button> </section> </div> <div></div> </body> </html>
以上这篇JS控制鼠标拒绝点击某一按钮的实例就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。
您可能感兴趣的文章: