jQuery点击图片开启，再次点击图片关闭效果

POOPE

要求：jQuery点击图片开启，再次点击图片关闭效果
2：获取选中的图片的状态
并以整型的格式传给后端
3：获取并且渲染传给数据库的图片状态

<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
  <head>
    <title>下拉框select赋值</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <link rel="stylesheet" href="https://cdn.bootcss.com/twitter-bootstrap/4.3.1/css/bootstrap.min.css">
    <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
    <script src="https://cdn.bootcss.com/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>
    <style>
      .staffContainer{
        display: none;
      }
    </style>
  </head>
  <body>
    <img id="bindStaff" class="bindclick" src="images/off.png">
    <button type="button" class="btn blue" id="addBtn">保存</button>
  </body>
  <script type="text/javascript">
    /* 实现图片切换 */
    $(".bindclick").click(function() {
      if ($("#bindStaff ").prop("src").indexOf("on") > -1) {
        $(this).attr("src", "images/off.png");
      } else {
        $(this).attr("src", "images/on.png");
      }
    })
    $("#addBtn").on("click", function() {
      var params = {
        bindStaff: $("#bindStaff ").prop("src").indexOf("on") > -1 ? 1 : 0,
      }
      alert(JSON.stringify(params))
      $.ajax({
        contentType: 'application/json',
        url: basePath + "/app",
        data: JSON.stringify(params),
        type: "post",
        success: function(data) {
        },
        error: function(data) {
          layer.msg("服务器繁忙", {
            icon: 5,
            time: 1000
          });
        }
      });
    })
  </script>
</html>

[jQuery] jQuery点击图片开启，再次点击图片关闭效果

相关帖子

WordPress怎么获取当前页面URL地址

常用jquery右健禁止命令

uni-app 利用canvas画简单海报并保存图片

php使用GD库创建图片缩略图的方法

7种好看的鼠标点击效果

解决编辑器图片插入多次但发布后只显示一次问题

Discuz应用中心恢复授权的方法

使用原生querySelectorAll和forEach来实现点击切换

阿里云盘获取refresh_token方法

POOPE LV4