码迷,mamicode.com
首页 > Web开发 > 详细

jquery点击事件案例

时间:2019-05-09 22:15:55      阅读:268      评论:0      收藏:0      [点我收藏+]

标签:select   title   doc   ted   bsp   meta   option   删除按钮   ndt   

<!DOCTYPE html>

<html lang="en">

<head>

   <meta charset="UTF-8">

   <title>Document</title>

   <script type="text/javascript" src="jquery.1.11.1.min.js"></script>

</head>

<body>

   <select id="s1" size="2" style="width: 400px;height: 200px;">

      <option>1</option>

      <option>2</option>

      <option>3</option>

   </select>

  

   <select id="s2" size="2" style="width: 400px;height: 200px;"></select>

   <button id="add">添加</button>

   <button id="del">删去</button>

  

   <script type="text/javascript">

      $("#add").click(function(){              //将事件绑定在按钮身上

         var opt = $("#s1 option:selected").clone(true);  // 克隆选中option

         opt.appendTo($("#s2"));            //把 opt 添加到 s2

      });

      $("#del").click(function(){          //删除按钮点击的时候,事件在点击时触发

         var opt = $("#s2 option:selected");

         opt.remove();                 // opt 被移除

      })

   </script>

</body>

</html>

 

网页效果如下

  技术图片

 

jquery点击事件案例

标签:select   title   doc   ted   bsp   meta   option   删除按钮   ndt   

原文地址:https://www.cnblogs.com/binghuaZhang/p/10841100.html

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