时间戳

首页 > 解决方案 > 如何在第二次单击 jquery 时更改 SVG 填充颜色

javascript - 如何在第二次单击 jquery 时更改 SVG 填充颜色

问题描述

我正在尝试在第二次单击时更改 SVG 上的填充颜色，目前，可以在第一次单击时添加填充颜色，但我希望在第二次单击时颜色更改/重置为默认值；这是我当前的代码：

jQuery('#color-my-svg').on("click", function() {
  if(!jQuery(this)[0].hasAttribute('style')){
    jQuery('#color-my-svg').css({ fill: "#ff0000" });
  }
  else{
    jQuery(this).removeAttr('style');
  }
});

标签： javascriptjquery

解决方案

每当用户点击元素时：

  • 如果元素具有类标识符（例如
    click-one），则更改填充颜色。

  • 否则添加类标识符。

jQuery('#color-my-svg').on("click", function() {
  if(jQuery('#color-my-svg').hasClass("click-one")) 
    jQuery('#color-my-svg').css({ fill: "#ff0000" });
  else 
    jQuery('#color-my-svg').addClass("click-one");
});

推荐阅读