码迷,mamicode.com
首页 > 编程语言 > 详细

鼠标单击事件--JavaScript

时间:2016-12-16 19:49:51      阅读:165      评论:0      收藏:0      [点我收藏+]

标签:size   color   remove   title   asc   不可点击   val   图片   one   

<html>
<head>
<title></title>
</head>
<script type="text/javascript">
//点击按钮让图片消失
function init(){
    //拿到按钮对象
    var btn1 = document.getElementById("btn1");
    var btn2 = document.getElementById("btn2");
    //注册事件
    btn1.onclick = function(){
        //拿到图片对象
        var img = document.getElementById("img");
        img.style.display = "none"; //显示属性
        this.disabled = "true"; //设置按钮不可点击,this代表当前对象
    }
    btn2.onclick = function(){
        //拿到图片对象
        var img = document.getElementById("img");
        img.style.display = "block"; //显示属性
        var btn1 = document.getElementById("btn1");
        btn1.removeAttribute("disabled");
        //btn1.disabled = "false";//设置按钮可以点击,但是属性仍然在,需要先删除该属性
    }
}
function fun3(obj){
        obj.value="|||||||";
    }
function fun4(){
    var p = document.getElementById("p");
    p.innerHTML = "<img src = ‘1.png‘ width=‘200‘ height = ‘200‘>";//外边是双引号,里边必须是单引号
}
</script>

<body onload = "init()">
<img src="1.png" id="img"><br><br>
<input type="button" value="图片消失" id = "btn1" >
<input type="button" value="图片出现" id = "btn2" >
<input type="button" value="---------" id = "btn3" onclick="fun3(this)"><!--改变value的值-->
<input type="button" value="添加一副图片" id = "btn4" onclick="fun4()"><!--修改页面的HTML属性-->
<p id = "p"></p>
</body>
</html>

 

鼠标单击事件--JavaScript

标签:size   color   remove   title   asc   不可点击   val   图片   one   

原文地址:http://www.cnblogs.com/taiguyiba/p/6187980.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!