JQ单选框，选择后按钮出现图片

来源：互联网发布：手机直播软件编辑：程序博客网时间：2024/05/21 15:31

<!DOCTYPE html><html>   <head>      <meta charset="UTF-8">      <title></title>      <script src="../../../js/jquery-3.1.1.min.js" type="text/javascript" charset="utf-8"></script>      <script type="text/javascript">         $(function(){            $("#b").click(function(){               var val=$("input:checked").val();               switch(val) {                  case 'a':                  $("img").attr('src','pingguo.jpg');                  break;                  case 'b':                  $("img").attr('src','xiangjiao.jpg');                  break;                  case 'c':                  $("img").attr('src','putao.jpg');                  break;                  case 'd':                  $("img").attr('src','li.jpg');                  break;                  case 'e':                  $("img").attr('src','xigua.jpg');                  break;               }            })         })      </script>   </head>   <body>      <img src="pingguo.jpg.jpg"/>      <br />      <h1>请选择水果</h1>      <input type="radio" name="fruit" value="a" checked="checked" />香蕉      <input type="radio" name="fruit" value="b" />梨      <input type="radio" name="fruit" value="c" />葡萄      <input type="radio" name="fruit" value="d" />苹果      <input type="radio" name="fruit" value="e" />西瓜      <input type="button" id="b" value="改变图片" />   </body></html>

阅读全文

0 0