Access control using $(this) within setTimeout()

Total Post:117

 1889  View(s)
Rate this:

I have a list of HTML controls and I need to bind a listener for the keyup event to each of these. Once that is triggered, some other actions should subsequently be kicked off after a time delay. I'm using setTimeout for that.

$(".TextBoxClass").each(function () {
  $(this).keyup(function () {
    alert("Id = " + $(this));   
    setTimeout(function () {
       alert("current Id = " + $(this))
    }, 50);

The first alert message shows the correct id of the control which triggers the keyup event. The second alert within the setTimeout says current id = [object][object].

How can I access the control within the setTimeout callback function?

  1. Post:101

    Re: Access control using $(this) within aetTimeout()

    <div id="controls">
        <input class="TextBoxClass" type="text" value="1" id="id-1">
        <input class="TextBoxClass" type="text" value="2" id="id-2">
        <input class="TextBoxClass" type="text" value="3" id="id-3">
        <input class="TextBoxClass" type="text" value="4" id="id-4">
        <input class="TextBoxClass" type="text" value="5" id="id-5">
    $('#controls').on('keyup', '.TextBoxClass', function () {
      var $this = $(this);
        // alert("current value = " + $this.val()); 
        alert("current element id = " + $this.attr('id')); 
      }, 50);

      Modified On Apr-06-2018 05:35:30 AM