0

I'm dynamically appending a range input to the html body:

var slider = "<input type='range' min='1' max='100' value='50' class='slider' id='slider_1' oninput='f1()'>";
$('body').append(slider);

On each input, the function f1() should fire, e.g.

function f1(){
  console.log('fired');
}

With the code above, f1() fires each time the input is changed - just what I want.

However, the oninput function needs some parameters that are established later, so I want to add it programmatically like:

$("#slider_1").oninput = f1();

If I do this, f1() only fires once and not with every input.

Why is this and how can I change it?

ben_aaron
  • 1,504
  • 2
  • 19
  • 39
  • 1
    The jQuery syntax for adding a listener is `$(selector).input(callback)`. In general, jQuery doesn't use property assignments, it does everything with functions. – Barmar Oct 07 '18 at 15:02
  • Actually a slighlty different solution does the job (wasn't specifying that I use JQuery > 1.8): `$("#slider_1").on('input', function() {...}`. Didn't know that the other solutions are outdated. Thanks for pointing me into that direction. – ben_aaron Oct 07 '18 at 15:20
  • Sorry, didn't realize that the `input` event doesn't have a shortcut method like `click` does. – Barmar Oct 07 '18 at 15:26

0 Answers0