0

好吧，经过几个小时试图找出一种方法来做到这一点，我什么也没想到。我知道我需要 SVG jQuery 插件，所以我拥有它并且已经让 toggleClass() 函数工作，但我试图从我的所有组元素中删除类，然后将另一个类添加到组元素中：

$('g').removeClass().addClass('slice');

我从 jQuery 站点上的 removeClass 文档中发现了这行代码。

最终我的愿望是拥有这个技能饼图，当点击一个切片时，它会从饼图中稍微移除，直到点击另一个切片。一旦单击另一个切片，则将前一个切片返回到饼图并拉出新单击的切片。你可以通过查看我的 jsFiddle 来了解我的意思。我已经设法将切片拉出，但我正在努力让它们在单击另一个切片时滑回。

jsFiddle 示例：http: //jsfiddle.net/jrjacobs24/BhWCh/30/

我一直在尝试在这里查看 Keith Wood 插件的文档：

http://keith-wood.name/svg.html#dom

但只是没有任何运气。任何帮助将不胜感激。让我知道是否有任何模糊或需要澄清的地方。先感谢您！

4

4 回答 4

1

尝试这个：

$('g').attr("class","").addClass('slice');
于 2013-08-26T08:26:51.907 回答
0

代替g, 使用idjquery 的选择器。

于 2013-08-26T08:23:49.160 回答
0

尝试这个：

$(".slice").click(function () {

    $('g').attr("class","").addClass('slice');

    if ($(this).is("#HTML_1_")) {            
        $(this).toggleClass("HTML_1_clicked");
    } else if ($(this).is("#Wordpress")) {            
        $(this).toggleClass("Wordpress_clicked");
    } else if ($(this).is("#jQuery")) {           
        $(this).toggleClass("jQuery_clicked");
    } else if ($(this).is("#java_1_")) {            
        $(this).toggleClass("java_1_clicked");
    } else if ($(this).is("#Dreamweaver")) {            
        $(this).toggleClass("DW_clicked");
    } else if ($(this).is("#Photoshop")) {           
        $(this).toggleClass("PS_clicked");
    } else {            
        $(this).toggleClass("CSS_clicked");
    }
});

在这里工作小提琴：http: //jsfiddle.net/BhWCh/31/

于 2013-08-26T08:30:43.043 回答
0

您最好将其视为元素.clicked的状态/类。.slice没有必要删除.slice类。

看看这个小提琴：http: //jsfiddle.net/sinsedrix/AKXTV/

于 2013-08-26T09:16:29.280 回答