Click on div with javascript or jquery

Question

I have a clickable div and I want to some how with javascript or jquery to be able to click on it automatically.

My div is like this:

<div style="display:none;" id="button">Hello</div>

That is click able div when display changed to block I need some script to do that for me.

I need some script like, when it sees that div display changed to block then script must click on div id="button"

I have tried this but this is not for that as I searched on google

<script type="text/javascript">

$(document).ready(function(){
  $('#button').trigger('click');
});

</script >

Possible duplicate of How to programmatically trigger the click on a link Using jquery? — Mohammad
– Mohammad, Commented Oct 9, 2016 at 20:15

uladzimir · Accepted Answer · 2016-10-11 11:30:15Z

0

Here is an example in JS:

<div style="display:none;" id="button">Hello</div>


<script>
  document.addEventListener('DOMContentLoaded', function() {
    var button = document.getElementById('button');
        
    button.addEventListener('click', function() {
      this.style.display = 'block';  
    })
        
    if (button.style.display === 'block') {
      button.click()
    }
  });
</script >

Update:

If you need to click on button after some javascript actions, just add there following lines:

if (button.style.display === 'block') {
  button.click()
}

Update2:

In the provided page I found the method to show mentioned div:

function startChecking() {
    secondsleft -= 1e3,
    document.querySelector(".load_stream").innerHTML = "Please Wait.. " + Math.abs(secondsleft / 1e3) + " Seconds",
0 == secondsleft && (clearInterval(interval),
    $(".reloadframe").show(),
    document.querySelector(".load_stream").style.display = "none",
    $("#btn_play_s").show()
    //You need to place it here, after "show" div will be displayed
    // and display will have value "block"
  )
}

So you can replace last line with $('#btn_play_s').show().click() instead of $('#btn_play_s').show(), it will be enough.

edited Oct 11, 2016 at 11:30

answered Oct 9, 2016 at 20:44

uladzimir

5,6897 gold badges34 silver badges51 bronze badges

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

12 Comments

ronaldo cr Over a year ago

but i want it to check on div display like, when display = block then it must click on it

uladzimir Over a year ago

@ronaldocr could you please clarify when it sees that div display changed to block?

ronaldo cr Over a year ago

i will give you some example, now on page i have tht div above with style display:none i have a code on my page it will change after 10 seconds that display:none to display:block . so what i am asking from you to help me to find a code to make it like this, when style became display:block then your code must click on that div

uladzimir Over a year ago

@ronaldocr you can just put if (button.style.display === 'block') { button.click() }; to any place you're changing the display property of div

ronaldo cr Over a year ago

as you see this is one of my pages, tgo-tv.com/watch/channel/28.php after 10 seconds countdown this div will display " btn_play_s " on countdown is place and i placed your code at head section i don't know your code is not working or i placed i wrong

|

n.y · Accepted Answer · 2016-10-09 20:50:51Z

0

Simply use $('#button').click(); every where you want.

If you want to trigger this event when button display changed first you need create an event for this (because Jquery don't have on display changed event). And then trigger it's your self:

$('#button2').on('click',function(){
    $('#button')
    .css('display','block')
    .trigger('isVisible');
});

$('#button').bind('isVisible',function() {
   alert('Clicked...!');
});


$(function(){
    $('#button').click();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="button" id="button2" value="display the button"/>
<div style="display:none;" id="button">Hello</div>

edited Oct 9, 2016 at 20:50

answered Oct 9, 2016 at 20:34

n.y

3,5003 gold badges39 silver badges59 bronze badges

Collectives™ on Stack Overflow

Click on div with javascript or jquery

2 Answers 2

12 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

12 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related