Getting 'For Loop' to work the same as 'forEach'












0















This one uses For Loop



After you click on another button they don’t change back to the play button, and instead they stay on pause. The audio pauses without an issue, it’s just the buttons that don’t change back for some reason.



https://jsfiddle.net/pezuLqvo/85/



enter image description here



function hideAllButtons(button) {
const buttons = button.querySelectorAll(".play, .pause, .speaker");
for (let i = 0; i < buttons.length; i += 1) {
hide(buttons[i]);
}
}

function pauseAllButtons(buttons) {
for (let i = 0; i < buttons.length; i += 1) {
if (isPlaying(buttons[i])) {
showPlayButton(buttons[i]);
}
}
}

function showPauseButton(button) {
const pause = getPause(button);
pauseAllButtons(button);
hideAllButtons(button);
show(pause);
button.classList.add("active");
}


Looking at how this one was set up, are you able to determine what I would change in the above code to fix that issue?



This one uses forEach



https://jsfiddle.net/pezuLqvo/84/



enter image description here



function hideAllButtons(button) {
button.querySelectorAll(".play, .pause, .speaker").forEach(hide);
}

function pauseAllButtons() {
const buttons = document.querySelectorAll(".playButton");
buttons.forEach(function hidePause(button) {
if (isPlaying(button)) {
showPlayButton(button);
}
});
}

function showPauseButton(button) {
const pause = getPause(button);
pauseAllButtons();
hideAllButtons(button);
show(pause);
button.classList.add("active");
}









share|improve this question

























  • you missing this line to the code you posted with for const buttons = document.querySelectorAll(".playButton");

    – Panos K
    Nov 22 '18 at 7:38
















0















This one uses For Loop



After you click on another button they don’t change back to the play button, and instead they stay on pause. The audio pauses without an issue, it’s just the buttons that don’t change back for some reason.



https://jsfiddle.net/pezuLqvo/85/



enter image description here



function hideAllButtons(button) {
const buttons = button.querySelectorAll(".play, .pause, .speaker");
for (let i = 0; i < buttons.length; i += 1) {
hide(buttons[i]);
}
}

function pauseAllButtons(buttons) {
for (let i = 0; i < buttons.length; i += 1) {
if (isPlaying(buttons[i])) {
showPlayButton(buttons[i]);
}
}
}

function showPauseButton(button) {
const pause = getPause(button);
pauseAllButtons(button);
hideAllButtons(button);
show(pause);
button.classList.add("active");
}


Looking at how this one was set up, are you able to determine what I would change in the above code to fix that issue?



This one uses forEach



https://jsfiddle.net/pezuLqvo/84/



enter image description here



function hideAllButtons(button) {
button.querySelectorAll(".play, .pause, .speaker").forEach(hide);
}

function pauseAllButtons() {
const buttons = document.querySelectorAll(".playButton");
buttons.forEach(function hidePause(button) {
if (isPlaying(button)) {
showPlayButton(button);
}
});
}

function showPauseButton(button) {
const pause = getPause(button);
pauseAllButtons();
hideAllButtons(button);
show(pause);
button.classList.add("active");
}









share|improve this question

























  • you missing this line to the code you posted with for const buttons = document.querySelectorAll(".playButton");

    – Panos K
    Nov 22 '18 at 7:38














0












0








0








This one uses For Loop



After you click on another button they don’t change back to the play button, and instead they stay on pause. The audio pauses without an issue, it’s just the buttons that don’t change back for some reason.



https://jsfiddle.net/pezuLqvo/85/



enter image description here



function hideAllButtons(button) {
const buttons = button.querySelectorAll(".play, .pause, .speaker");
for (let i = 0; i < buttons.length; i += 1) {
hide(buttons[i]);
}
}

function pauseAllButtons(buttons) {
for (let i = 0; i < buttons.length; i += 1) {
if (isPlaying(buttons[i])) {
showPlayButton(buttons[i]);
}
}
}

function showPauseButton(button) {
const pause = getPause(button);
pauseAllButtons(button);
hideAllButtons(button);
show(pause);
button.classList.add("active");
}


Looking at how this one was set up, are you able to determine what I would change in the above code to fix that issue?



This one uses forEach



https://jsfiddle.net/pezuLqvo/84/



enter image description here



function hideAllButtons(button) {
button.querySelectorAll(".play, .pause, .speaker").forEach(hide);
}

function pauseAllButtons() {
const buttons = document.querySelectorAll(".playButton");
buttons.forEach(function hidePause(button) {
if (isPlaying(button)) {
showPlayButton(button);
}
});
}

function showPauseButton(button) {
const pause = getPause(button);
pauseAllButtons();
hideAllButtons(button);
show(pause);
button.classList.add("active");
}









share|improve this question
















This one uses For Loop



After you click on another button they don’t change back to the play button, and instead they stay on pause. The audio pauses without an issue, it’s just the buttons that don’t change back for some reason.



https://jsfiddle.net/pezuLqvo/85/



enter image description here



function hideAllButtons(button) {
const buttons = button.querySelectorAll(".play, .pause, .speaker");
for (let i = 0; i < buttons.length; i += 1) {
hide(buttons[i]);
}
}

function pauseAllButtons(buttons) {
for (let i = 0; i < buttons.length; i += 1) {
if (isPlaying(buttons[i])) {
showPlayButton(buttons[i]);
}
}
}

function showPauseButton(button) {
const pause = getPause(button);
pauseAllButtons(button);
hideAllButtons(button);
show(pause);
button.classList.add("active");
}


Looking at how this one was set up, are you able to determine what I would change in the above code to fix that issue?



This one uses forEach



https://jsfiddle.net/pezuLqvo/84/



enter image description here



function hideAllButtons(button) {
button.querySelectorAll(".play, .pause, .speaker").forEach(hide);
}

function pauseAllButtons() {
const buttons = document.querySelectorAll(".playButton");
buttons.forEach(function hidePause(button) {
if (isPlaying(button)) {
showPlayButton(button);
}
});
}

function showPauseButton(button) {
const pause = getPause(button);
pauseAllButtons();
hideAllButtons(button);
show(pause);
button.classList.add("active");
}






javascript for-loop foreach






share|improve this question















share|improve this question













share|improve this question




share|improve this question








edited Nov 22 '18 at 7:30









barbsan

2,43621223




2,43621223










asked Nov 22 '18 at 7:23









J DawgJ Dawg

448




448













  • you missing this line to the code you posted with for const buttons = document.querySelectorAll(".playButton");

    – Panos K
    Nov 22 '18 at 7:38



















  • you missing this line to the code you posted with for const buttons = document.querySelectorAll(".playButton");

    – Panos K
    Nov 22 '18 at 7:38

















you missing this line to the code you posted with for const buttons = document.querySelectorAll(".playButton");

– Panos K
Nov 22 '18 at 7:38





you missing this line to the code you posted with for const buttons = document.querySelectorAll(".playButton");

– Panos K
Nov 22 '18 at 7:38












1 Answer
1






active

oldest

votes


















0














This was the answer:



https://jsfiddle.net/pezuLqvo/93/



function pauseAllButtons() {
const buttons = document.querySelectorAll(".playButton");
for (let i = 0; i < buttons.length; i += 1) {
if (isPlaying(buttons[i])) {
showPlayButton(buttons[i]);
}
}
}





share|improve this answer























    Your Answer






    StackExchange.ifUsing("editor", function () {
    StackExchange.using("externalEditor", function () {
    StackExchange.using("snippets", function () {
    StackExchange.snippets.init();
    });
    });
    }, "code-snippets");

    StackExchange.ready(function() {
    var channelOptions = {
    tags: "".split(" "),
    id: "1"
    };
    initTagRenderer("".split(" "), "".split(" "), channelOptions);

    StackExchange.using("externalEditor", function() {
    // Have to fire editor after snippets, if snippets enabled
    if (StackExchange.settings.snippets.snippetsEnabled) {
    StackExchange.using("snippets", function() {
    createEditor();
    });
    }
    else {
    createEditor();
    }
    });

    function createEditor() {
    StackExchange.prepareEditor({
    heartbeatType: 'answer',
    autoActivateHeartbeat: false,
    convertImagesToLinks: true,
    noModals: true,
    showLowRepImageUploadWarning: true,
    reputationToPostImages: 10,
    bindNavPrevention: true,
    postfix: "",
    imageUploader: {
    brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
    contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
    allowUrls: true
    },
    onDemand: true,
    discardSelector: ".discard-answer"
    ,immediatelyShowMarkdownHelp:true
    });


    }
    });














    draft saved

    draft discarded


















    StackExchange.ready(
    function () {
    StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53425772%2fgetting-for-loop-to-work-the-same-as-foreach%23new-answer', 'question_page');
    }
    );

    Post as a guest















    Required, but never shown

























    1 Answer
    1






    active

    oldest

    votes








    1 Answer
    1






    active

    oldest

    votes









    active

    oldest

    votes






    active

    oldest

    votes









    0














    This was the answer:



    https://jsfiddle.net/pezuLqvo/93/



    function pauseAllButtons() {
    const buttons = document.querySelectorAll(".playButton");
    for (let i = 0; i < buttons.length; i += 1) {
    if (isPlaying(buttons[i])) {
    showPlayButton(buttons[i]);
    }
    }
    }





    share|improve this answer




























      0














      This was the answer:



      https://jsfiddle.net/pezuLqvo/93/



      function pauseAllButtons() {
      const buttons = document.querySelectorAll(".playButton");
      for (let i = 0; i < buttons.length; i += 1) {
      if (isPlaying(buttons[i])) {
      showPlayButton(buttons[i]);
      }
      }
      }





      share|improve this answer


























        0












        0








        0







        This was the answer:



        https://jsfiddle.net/pezuLqvo/93/



        function pauseAllButtons() {
        const buttons = document.querySelectorAll(".playButton");
        for (let i = 0; i < buttons.length; i += 1) {
        if (isPlaying(buttons[i])) {
        showPlayButton(buttons[i]);
        }
        }
        }





        share|improve this answer













        This was the answer:



        https://jsfiddle.net/pezuLqvo/93/



        function pauseAllButtons() {
        const buttons = document.querySelectorAll(".playButton");
        for (let i = 0; i < buttons.length; i += 1) {
        if (isPlaying(buttons[i])) {
        showPlayButton(buttons[i]);
        }
        }
        }






        share|improve this answer












        share|improve this answer



        share|improve this answer










        answered Nov 22 '18 at 7:38









        J DawgJ Dawg

        448




        448
































            draft saved

            draft discarded




















































            Thanks for contributing an answer to Stack Overflow!


            • Please be sure to answer the question. Provide details and share your research!

            But avoid



            • Asking for help, clarification, or responding to other answers.

            • Making statements based on opinion; back them up with references or personal experience.


            To learn more, see our tips on writing great answers.




            draft saved


            draft discarded














            StackExchange.ready(
            function () {
            StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53425772%2fgetting-for-loop-to-work-the-same-as-foreach%23new-answer', 'question_page');
            }
            );

            Post as a guest















            Required, but never shown





















































            Required, but never shown














            Required, but never shown












            Required, but never shown







            Required, but never shown

































            Required, but never shown














            Required, but never shown












            Required, but never shown







            Required, but never shown







            Popular posts from this blog

            MongoDB - Not Authorized To Execute Command

            How to fix TextFormField cause rebuild widget in Flutter

            in spring boot 2.1 many test slices are not allowed anymore due to multiple @BootstrapWith