jQuery小结5 

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 2 <html xmlns="http://www.w3.org/1999/xhtml">
 3 <head>
 4     <title></title>
 5     <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
 6     <script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>
 7     <style type="text/css">
 8         *{margin:0px;padding:0px;}
 9         body{font-size:12px;}
10         
11         .box{margin:10px;padding:10px;}
12         .box h3{margin:10px 0px;border-bottom:1px solid red;padding-bottom:10px;}
13         .box p{line-height:20px;}
14         
15         #allbox{margin:10px;padding:10px;}
16         #allbox div{border:5px solid #aaccff;margin-top:10px;height:50px;}
17         
18     </style>
19     <script type="text/javascript">
20 
21     $(function(){
22         $("#allbox div").dblclick(function(){
23         
24                 if(confirm("是否要删除？")==true){
25 
26                 $(this).remove();
27             }
28         })
29     })
30     </script>
31 
32 
33 </head>
34 <body>
35     <div class="box">
36         <h3>试题要求</h3>
37         <p>
38             1.双击allbox的每一个子div时，将被双击的div从界面中删除掉<br />
39             2.删除前弹出确认对话框，确定删除后再执行删除操作
40 
41         </p>
42     </div>
43 
44     <div id="allbox">
45         <div >box1</div>
46         <div >box2</div>
47         <div >box3</div>
48         <div >box4</div>
49         <div >box5</div>
50         <div >box6</div>
51     </div>
52 
53 
54 </body>
55 </html>

 

posted on 2015-12-13 22:37  guanzhenqiang  阅读(135)  评论(0)  编辑  收藏  举报

导航