Question

我有两个函数添加到收藏夹中，从收藏夹中移除哪些应该在点击上工作...但即使一个函数更改了类（并给出了所需的效果），jquery也无法选择更改的值用于运行其他函数的类......

HTML

<a href="#"><img class="<?php if($favorite == 1){ echo 'alreadyfavorite';} else { echo 'addtofavorite';} ?>" src="../images/system/addtofavorite.png"></a>

Jquery的

// On Search Property Results Page - Add to Favorite Button (Heart)

        $('.addtofavorite').click(function() {
            alert("add");
            var reference = this;
            $(reference).toggleClass("addtofavorite alreadyfavorite");

        });


        // On Search Property Results Page - Remove from Favorite Button (Heart)
        $('.alreadyfavorite').click(function() {
            alert("delete");
            var reference = this;
            $(reference).toggleClass("addtofavorite alreadyfavorite");

    });

警告应该说添加，然后css应该更改然后警报应该说删除，然后css应该更改，然后警报应该说是css应该更改...

只有css正在改变，但警报仍然相同......

Answer 1

如果您将$('.addtofavorite').click(function() {更改为$(document).on('click', '.addtofavorite', function() {，则它会按照您的意愿进行操作。

注意： css仅供查看示例。

希望有所帮助

$(document).on('click', '.addtofavorite', function() {
  alert("add");
  var reference = this;
  $(reference).toggleClass("alreadyfavorite addtofavorite");

});


// On Search Property Results Page - Remove from Favorite Button (Heart)
$(document).on('click', '.alreadyfavorite', function() {
  alert("delete");
  var reference = this;
  $(reference).toggleClass("alreadyfavorite addtofavorite");

});

.alreadyfavorite {
  height: 50px;
  width: 50px;
  background-color: yellow
}
.addtofavorite {
  height: 50px;
  width: 50px;
  background-color: red
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href="#">
  <img class="alreadyfavorite" />
</a>

Answer 2

您将“点击”绑定到一个令人兴奋的元素，因为您一次只有一个元素。

将其绑定到父级

        $('body').on("click",".addtofavorite", function() {
            console.log("add");
            var reference = this;
            $(reference).toggleClass("addtofavorite alreadyfavorite");
        });


       $('body').on("click",".alreadyfavorite", function() {
            console.log("delete");
            var reference = this;
            $(reference).toggleClass("addtofavorite alreadyfavorite");

    });

http://codepen.io/Maher-Fa/pen/KaQwZX?editors=1010

Jquery切换类值未被下一个Jquery函数选中

2 个答案: