将图标更改为webapp标题上的另一个图标

Question

我正在使用jquery mobile开发一个webapp，我希望能够在我点击另一个图标时更改右侧图标。例如，我有一个音频文件嵌入到具有属性“autoplay”的代码中，因此它会在页面加载后立即启动，但我想点击音量静音图标并将其更改为静音图标交叉标志让用户知道有一种方法可以点击和关闭它来收听背景声音。如果你们有任何想法我可以做到这样的事情。它会非常感激。

Answer 1

查看此演示http://jsfiddle.net/qp3bQ/1/

尝试点击右侧音量图标。

JQUERY

$('#volume').on('click', function(){
    var name = $(this).children('img').attr('src');
    if (name == 'http://www.flaticon.com/png/256/498.png')
        $(this).children('img').attr('src','http://www.flaticon.com/png/256/8785.png');
    else
        $(this).children('img').attr('src','http://www.flaticon.com/png/256/498.png');
});