JS中简单的点击事件

一.点击后弹出事件

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title></title></head><body><p id="p1" onclick="fun()">单击事件测试</p></body><script type="text/javascript">function fun() {var p1 = document.getElementById("p1");p1.innerText = "我被单击了!";p1.style.fontSize = "60px";//onclick单击}</script>
</html>

二.单击双击事件

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title></title><style type="text/css">#div1{width: 100px;height: 100px;background-color: black;}</style></head><body><div id="div1" onclick="zoomout()" ondblclick="zoomin()"></div></body><script type="text/javascript">//onclick单击事件 zoomin双击事件function zoomout(){var div1 =document.getElementById("div1");div1.style.width="200px";div1.style.height="200px";div1.style.backgroundColor="red";}function zoomin(){var div1=document.getElementById("div1");div1.style.width="100px";div1.style.height="100px";div1.style.backgroundColor="green";}</script>
</html>

三.长按或松开事件

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title></title><style type="text/css">#div1{width: 100px;height: 100px;background-color: black;}</style></head><body><div id="div1" onmousedown="zoomout()" onmouseup="zoomin()"></div></body><script type="text/javascript">//onmousedown长按   onmouseup松开function zoomout(){var div1 =document.getElementById("div1");div1.style.width="200px";div1.style.height="200px";div1.style.backgroundColor="red";}function zoomin(){var div1=document.getElementById("div1");div1.style.width="100px";div1.style.height="100px";div1.style.backgroundColor="green";}</script>
</html>

JS中简单的点击事件相关推荐

关于js中无法绑定点击事件
在js文件中添加点击事件失败,但是HTML中onclick就能成功. 解决办法:将js的引用的script标签放到</body>的后面.这样在页面渲染之后再执行js代码.
java添加按钮点击事件_如何为odoo 10中的按钮点击事件添加一个java脚本处理程序？...
我想使用java脚本为header中的按钮创建一个处理程序.下面我视图模型给出:如何为odoo 10中的按钮点击事件添加一个java脚本处理程序? inherit_id="web.asset ...
js中简单的使用webSocket
js中简单的使用webSocket 创建websocket对象 websocket事件 websocket方法实现简单链接 <input type="text" place ...
Mint-ui中loadmore(上拉加载下拉刷新)组件在ios中滑动会触发点击事件的解决方法...
bug说明: Mint-ui中loadmore(上拉加载下拉刷新)组件在使用fastclick的情况下 ,在ios设备中滑动会触发点击事件: 解决方法: 我是按需引入,去项目中找到loadmore ...
vue中父元素点击事件与子元素点击事件冲突
vue中父元素点击事件与子元素点击事件冲突在做vue项目的时候,遇到子元素有点击事件,父元素也有点击事件,当点击子元素时往往触发的是父元素的点击事件,产生冲突,怎样解决这个问题呢?这就用到vue事件 ...
JQ简单的点击事件介绍
JQ简单的点击事件介绍点击事件有单击和双击事件,相对于js来说jq用这些事件会比js简单方便的多最常见的给元素绑定一个点击事件,快捷方法或者on方法 $("#qwq").cli ...
在vue中，Echarts雷达图中indicator的点击事件，不能改变data中的值的解决方法
在vue中,Echarts雷达图中indicator的点击事件,不能改变data中的值的解决方法参考文章: (1)在vue中,Echarts雷达图中indicator的点击事件,不能改变data中的 ...
Android Listview中Button按钮点击事件冲突解决办法
今天做项目时,ListView中含有了Button组件,心里一早就知道肯定会有冲突,因为以前就遇到过,并解决过,可惜当时没有记录下来. 今天在做的时候,继续被这个问题郁闷了一把,后来解决后,赶紧来记录 ...
Android中按钮的点击事件的四种写法
如题,在Android中按钮的点击事件有四种写法,如下图. 界面为四个Button+一个TextView+一个ImageView activity_main布局文件如下: <?xml versi ...

JS中简单的点击事件

JS中简单的点击事件相关推荐

最新文章

热门文章