Home/ Questions/Q 8437811
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-10T07:32:16+00:00

I’ve been struggling with the below piece of code for far too long, trying

  • 0

I’ve been struggling with the below piece of code for far too long, trying to figure out how to pass the array which is being modified with every click to the function.

The problem is that as soon as the clickedLinks array is modified it affects the passedLinks array in the shoplist function.

I even got a great explanation of why this is happening but I’m not able to apply it correctly to my example. I tried clearing the array at different points but that didn’t work out. I’m starting to doubt if the whole logic of my code is flawed.

Any help would be appreciated.

Here is the code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
  <head>
    <title>
      Test 1
    </title>
    <script src="http://code.jquery.com/jquery-latest.js" type=
    "text/javascript">
</script>
  </head>
  <body>
    <div class="items">
      <ul>
        <li>
          <a href="#" id="link1">Link 1</a>
        </li>
        <li>
          <a href="#" id="link2">Link 2</a>
        </li>
        <li>
          <a href="#" id="link3">Link 3</a>
        </li>
        <li>
          <a href="#" id="link4">Link 4</a>
        </li>
      </ul>
    </div>

<script type="text/javascript">
    var clickedLinks = [];
    var passedItems = [];


    // Collect clicked link IDs into an array and pass the array as an argument to shoplist()
    $('.items a').click(function () {

    if (clickedLinks.indexOf(this.id) != -1) {
        var linkIndex = clickedLinks.indexOf(this.id);
        clickedLinks.splice(linkIndex, 1);
    } else {
        clickedLinks.push(this.id);
    }

    shoplist(clickedLinks);

    });


    function shoplist(ids) {
        passedItems.push(ids);
        alert(passedItems);
    }
</script>
</body>
</html>

Steps:

  1. Click “Link 1”
  2. Click “Link 2”

Expected Result: Alert window displays “link1, link1, link2”

Actual Result: Alert window displays “link1, link2, link1, link2”

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You are pushing the ids array as is, but then it gets changed later. You should push a copy of it by using slice. Something like:

    passedItems.push(ids.slice());

    Also, I couldn’t understand the need for the if clause. If the item already exists, just don’t add it; or am I missing something?

    See DEMO.

    • 0