jquery event.currentTarget chield元素的切换类不工作

iih3973s  于 2022-12-18  发布在  jQuery
关注(0)|答案(1)|浏览(127)

我正在尝试切换element.currentTarget的一个类的chield元素,但它不工作。我不知道该怎么办。
超文本:

<div class="post-footer-icons-container-el" data-btntype="comment">
    <div class="post-footer-icons-circle bluei">
        <img class="post-footer-icons"src="/icons/chat-bubble.png"> 
    </div>
      UserPosts[i].retweetedpost.numComments %> 
 </div>

联森:

event.currentTarget.children(".post-footer-icons-circle").removeClass("redl");

我不介意是否使用这个类,我只想选择第一个且唯一的子类并切换该类。
所有代码:

$(".post-footer-icons-container-el").on("click",function(event){
    event.preventDefault();
    const postid = event.currentTarget.parentElement.getAttribute("data-postId");
    const typebtn = event.currentTarget.getAttribute("data-btntype");
    
    if(typebtn==="like"){
        //no funciona async await en jquery .on
        axios.post("http://127.0.0.1:3000/useractions/likepostmanage",{
                "likedpost":postid
            }).then(function(response){
                //the parent event handler will not be triggered
                
        });

        event.currentTarget.children(".post-footer-icons-circle").toggleClass("redl"):
    }
    if(typebtn==="rt"){
        //no funciona async await en jquery .on
        axios.post("http://127.0.0.1:3000/useractions/retweetpostmanage",{
                "retweetedpost":postid
            }).then(function(response){
                //the parent event handler will not be triggered
                
        });
        $(event.currentTarget).find(":selected").toggleClass("redl");
    }
    
    event.stopPropagation(); 
});


任何事都对我和查尔兹一起工作有用。
上面的代码也给了我一个错误:
未捕获的类型错误:事件.currentTarget.children不是函数

bmp9r5qi

bmp9r5qi1#

使用jQuery对象$(this)并使用eq调用第一个.children()来切换类。
示例:

$(".post-footer-icons-container-el").on("click", function(event) {
  $(this).children(".post-footer-icons-circle:eq(0)").toggleClass("redl");
});
.redl {
  background: red;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="post-footer-icons-container-el" data-btntype="comment">
  <div class="post-footer-icons-circle bluei">
    <img class="post-footer-icons" src="/icons/chat-bubble.png">
  </div>
  count
</div>

相关问题