jqueryhtmlaudiotogglemute

Toggling the 'muted' attribute of HTML5 audio


I am trying to create a mute/unmute button, I'm quite new to jquery so it would be helpful if anyone could give me any pointers:

$("#dinner").click(function() {
       var bool = $("#player").muted;
       $("#player").attr("muted",!bool);
});

Solution

  • fixed it, the 'muted' attribute is actually a property:

    $("#dinner").click(function() {
            var bool = $("#player").prop("muted");
            $("#player").prop("muted",!bool);
    });
    

    This can also be done slightly more succinctly by using ES6 arrow functions and also by providing a function to prop() which accepts the current state of the property as an argument. In this case the code would look something like this:

    $('#dinner').on('click', () => $('#player').prop('muted', (_, muted) => !muted));