javascript - js函数onclick需要点击一次改变字体

Question

当单击两次以更改字体时，事件在 js 中运行良好。我希望单击也能正常运行。

js代码如下。

function changered() {
iconsred.addEventListener('click', function(event) {
    event.target.classList.toggle('fas');
    event.style.color= "#ff0000";
 }) }

HTML 代码如下。

<a onclick="changered()" href="#">
   <div class="thumb-down">
     <i id="iconsred" class="far fa-thumbs-down fa-5x right"></i>
   </div>
</a>

Answer 1

问题是您在第一次点击后设置事件监听器，这就是为什么您需要第一次点击。

我不确定它是否符合您的需求，因为它有点不同，但您可以在 changered 回调中更改颜色，而不是添加事件监听器。像这样的东西:

function changered() {
  icon = document.getElementById('iconsred');
  icon.classList.toggle('fas');
  icon.style.color= "#ff0000";
}