[英]event.currentTarget toggle class of chield element not working
I am trying to toggle a class of chield element of the element.currentTarget
and its not working.我正在尝试切换
element.currentTarget
的一类 chield 元素,但它不起作用。 I don't know what to do.我不知道该怎么办。
HTML: HTML:
<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>
JS:记者:
event.currentTarget.children(".post-footer-icons-circle").removeClass("redl");
I don't mind if I use this class or not, I just want to select the first and unique child and toggle the class.我不介意我是否使用这个课程,我只想选择第一个和唯一的孩子并切换课程。
All code:所有代码:
$(".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();
});
Anything is working for me for work with childs.与孩子一起工作对我来说任何事情都适用。
Also above code gives me an error:上面的代码也给我一个错误:
Uncaught TypeError: event.currentTarget.children is not a function
未捕获的类型错误:event.currentTarget.children 不是函数
Use jQuery object $(this)
and call the first .children()
using eq
to toggle your class.使用 jQuery 对象
$(this)
并使用eq
调用第一个.children()
来切换你的类。
Example:例子:
$(".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>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.