how to avoid from ajax call same function with .scroll(function() if i was click on another div with-CodePudding

in this code you can see that i have two div tags that every one of them have not the same onclick="" function call, the problem is when i click on one of them and then click on enother one the .scroll(function() works also from the first clicked function, this example with alert only,

<div  onclick="firstFunction();">First Div</div>
<div  onclick="secondFunction();">Second Div</div>
<div ></div>
<script >

        function firstFunction(){

          var one = '<?php echo $someValueOne; ?>';
          var two = '<?php echo $someValueTwo; ?>';                      

                    $.ajax({
                        type:'GET',
                        url:'getSomethingOne.php',
                        data: {
                            'SomethingOneInFirstFunction':one,
                            'SomethingTwoInFirstFunction':two
                        },
                       
                        success:function(data){
                            
                $('.result').html(data);

                                         },
        
            });
            
            $('.result').scroll(function(){
   

                                  alert("Hello! to the first box!!");

            });
            
        }

        function secondFunction(){
    
          var one = '<?php echo $someValueOne; ?>';
          var two = '<?php echo $someValueTwo; ?>';   
                
                    $.ajax({
                        type:'GET',
                        url:'getSomethingTwo.php',
                        data: {
                            'SomethingOneInSecondFunction':one,
                            'SomethingTwoInSecondFunction':two
                        },
                       
                        success:function(data){
                            
                $('.result').html(data);

                                         },
        
            });
            
            $('.result').scroll(function(){
   

                                  alert("Hello! to the second box!!");

            });
            
        }
</script>

even if you will try without the ajax call and only with on click function its will continue the first clicked function scroll call,

how can i stop this?...

CodePudding user response：

You should set your listener for one-time usage. The problem is that you are setting a new scroll handler for the same HTML element on every call of your function and they are never removed.

$('.result').one('scroll', function() {...})

CodePudding user response：

i was added to the start of each function

$(".result").unbind();

thank you epascarello