Javascript pass variable value from one function to another

Question

I need to pass the value 7 as a parameter whenever i call check_scroll() function.

But now the lastcount value keeps on increasing even though i call check_scroll() function.

Please keep me some suggestion.

Check the code snippet as like i say,

first click on the first click me to initiate check_scroll function button, then scroll inside the div, you get an alert with value incrementing by 7.

Then click the button and then again scroll, but now the alert wont start from 7.

  $("#mybutton").click(function() {

    check_scroll(7);

  })

  function check_scroll(val) {

    var lastcount = val;
    $('#notification_ul').scroll(function() {
      if ($('#notification_ul').scrollTop() + $('#notification_ul').innerHeight() == $('#notification_ul')[0].scrollHeight) {

            $("#notification_ul").append("<br/> Some Text Append <br/>");
            alert(lastcount);

        lastcount = lastcount + 7;
      }

    })
  }

div {
  width: 200px;
  height: 200px;
  overflow: auto;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="notification_ul">
  Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has
  survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing
  software like Aldus PageMaker including versions of Lorem Ipsum.
</div>

<button id="mybutton">
  first click me to initiate check_scroll function
</button>

Every time you call check_scroll(), you're establishing a new scroll handler - the previously-installed handlers will continue to be called. After you have clicked the button 5 times, there will be 5 scroll event handlers called. Each one will start out with lastcount at 7, but each scroll event will increment the counter. — Pointy
– Pointy, Commented Jun 29, 2016 at 13:41
Sorry, how to fix it. I need to increment from 7 whenever i click the button. — Vignesh Chinnaiyan
– Vignesh Chinnaiyan, Commented Jun 29, 2016 at 13:44
Declare the lastcount = 7 globally outside functions. dosn't pass it in check_scroll and keep incrementing in the function as you are doing right now. — Abdul Rehman
– Abdul Rehman, Commented Jun 29, 2016 at 13:49
Also use console.log() instead of alert(); the "scroll" event is fired very aggressively by browsers, and you'll be dealing with thousands of alert boxes. — Pointy
– Pointy, Commented Jun 29, 2016 at 13:55
As @Pointy pointed out. Just unbind the scroll event before binding it like $('#notification_ul').off("scroll").on("scroll", function() { — a_nain
– a_nain, Commented Jun 29, 2016 at 14:00

Hui-Yu Lee · Accepted Answer · 2016-06-30 05:48:24Z

1

define scroll event only once
move lastcount to outside
when the button is clicked, reset lastcount

$(function(){
    var lastcount = 0;

    $("#mybutton").click(function() {
        check_scroll(7);
    });

    $('#notification_ul').scroll(function() {
        if (lastcount !== 0) {
            if ($('#notification_ul').scrollTop() + $('#notification_ul').innerHeight() == $('#notification_ul')[0].scrollHeight) {
                $("#notification_ul").append("<br/> Some Text Append <br/>");
                console.log(lastcount);
                lastcount = lastcount + 7;
            }
        }
    });
});

function check_scroll(val) {
    lastcount = val;
}

edited Jun 30, 2016 at 5:48

answered Jun 29, 2016 at 14:28

Hui-Yu Lee

9899 silver badges22 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Vignesh Chinnaiyan Over a year ago

Thanks @iownthegame, your solution worked, and your explanation also good.

Vignesh Chinnaiyan Over a year ago

And 1 more doubt, why this happens actually ? can you explain little bit more

Hui-Yu Lee Over a year ago

Actually I don't know what would happen, I also want someone to tell me why. However my knowledge is telling me to bind each event only once. see stackoverflow.com/questions/8408826/bind-event-only-once and stackoverflow.com/questions/2180326/…

Vignesh Chinnaiyan · Accepted Answer · 2016-06-30 05:35:14Z

Final Answer after referring your suggestions, Thanks you guys for the fast solution and suggestion. Thumbs Up

var lastcount = 7;
$("#mybutton").click(function() {
	check_scroll(7);
})

$('#notification_ul').scroll(function() 
{
     if ($('#notification_ul').scrollTop() + $('#notification_ul').innerHeight() == $('#notification_ul')[0].scrollHeight) 
     {
		
    $("#notification_ul").append("<br/> Some Text Append <br/>");
    
    alert("last count after scroll " + lastcount);
		
    lastcount = lastcount + 7;
     }

})

function check_scroll(val) {
	lastcount = val;
	alert("Last count reseted to " + lastcount);
}

div {
  width: 200px;
  height: 200px;
  overflow: auto;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="notification_ul">
  Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has
  survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing
  software like Aldus PageMaker including versions of Lorem Ipsum.
</div>

<button id="mybutton">
  sometext
</button>

Collectives™ on Stack Overflow

Javascript pass variable value from one function to another

2 Answers 2

3 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related