Question

每当单击按钮时，我都试图更改数据属性的值和背景色，因此它需要考虑多次单击，因为它会在事件单击元素时进行ajax调用。

到目前为止，发生的事情是背景色发生了变化，数据属性也发生了变化，但是，第二次单击原始data-status值，即使if语句中的$(document).ready(function () { $('.button-create').click(function () { // assign data from data attributes to variables var check = $(this).data("value"); var checkID = $(this).data("checkid"); var legend = $(this).data("legend"); var area = $(this).data("area"); var status = $(this).data("status"); // ajaxCall(check, checkID, legend, area, $status) //change colour when clicked based on status if($(this).data("status") == 0) { console.log("Element has been clicked to green"); $(this).css('background', 'green !important'); $(this).attr('data-status','1') } else if ($(this).data("status") == 1) { console.log("Element has been clicked to change to red"); $(this).css('background', 'red !important'); $(this).attr('data-status','0') }; }) })值已经在if语句中发生了变化。原始点击。

<html>
<script
  src="https://code.jquery.com/jquery-3.3.1.min.js"
  integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
  crossorigin="anonymous"></script>
<body>
  <button class='check-box button-create' data-value='AUDIT' data-checkid='86' data-legend='3' data-area='8' data-status='1' type='submit' name='submit' value='submit'></button>
</body>
</html>

eax

我们非常感谢您的帮助！谢谢

Answer 1

您需要使用.data()而不是.attr()来设置属性值：

使用：

$(this).data('status','0')

代替：

 $(this).attr('data-status','0')

根据具有数据属性的if语句更改单击时的背景颜色

1 个答案: