jquery function fires on declaration

This runs out of my "page initialized" function

function SetUpJQSliderElements() {

    var $SizeSlider = $("#SizeSlider").slider({
        min: .5,
        max: 2,
        step: .25,
        animate: "slow",
        value:.75
    })

    $SizeSlider.on("slidechange", function () {
        SizeFactorChange()
    })
    
    var SizeFactorDisplay = $("#SizeFactorDisplay")
}

Open in new window


How might I specify the SizeSlider.on function (SizeFactorChange) so that it does not execute at the time of declaration?
LVL 2
codequestAsked:
Who is Participating?
 
Kyle HamiltonConnect With a Mentor Data ScientistCommented:
A function declaration defines a function. What you have are two function calls (not declarations), the first one of which is an event listener:

$SizeSlider.on()  <-- function call. The on function has an event listener built into it.

.on(event, callback) <-- arguments: the event, and the callback. The callback function will will be executed when the event happens

On line 11, you have a function which listens for the "slidechange" event. Every time this event happens, the callback function will be executed. In the callback you have a function call to the SizeFactorChange function. This will execute the SizeFactorChange function.

What is the issue, and what do you  want to happen?

If you don't want it to execute, remove it.
0
 
codequestAuthor Commented:
Thanks, that jogged me into understanding better what was needed:

function SetUpJQSliderElements() {

    var $MapSizeSlider = $("#MapSizeSlider").slider({
        min: .5,
        max: 2,
        step: .25,
        animate: "slow",
        value: .75,
        change: MapSizeFactorChange
    })

    //$MapSizeSlider.on("slidechange", function () {
    //    MapSizeFactorChange()
    //})
    
    var MapSizeFactorDisplay = $("#MapSizeFactorDisplay")
}

Open in new window

0
All Courses

From novice to tech pro — start learning today.