Trigger click on a span

Question

I want to click on a SPAN.show-more automatically. When i click on it shows hidden text. Its ID is a random number something like: SPAN#yui_3_9_1_10_1397969703476_624.show-more I use greaseMonkey. The page is: https://espanol.answers.yahoo.com/question/index?qid=20091125151524AAvxaLo

My wrong code is:

 var i,
 list = document.querySelectorAll(".show-more")
 for (i = 0; i < list.length; ++i) 
 { list[i].click();
 }

Maybe I need to wait until the page is full loaded? Do I need a delay?

If you use jQuery, this is really easy to do with `$(yourSelector).click()` or `$(yourSelector).trigger("click')`. — royhowie, Apr 20 '14 at 05:30
possible duplicate of [How to simulate a click with JavaScript?](http://stackoverflow.com/questions/2705583/how-to-simulate-a-click-with-javascript) — Farid Nouri Neshat, Apr 20 '14 at 05:45

score 1 · Answer 1 · edited Apr 20 '14 at 06:37

You can simply call a onclick() event like this:

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>Click</title>
</head>
<body>

<span class="show-none">hello</span>
<span onclick="this.style.backgroundColor = '#f47121'" class="show-more">hello</span>
<span onclick="this.style.backgroundColor = '#128239'" class="show-more">hello</span>

<script type="text/javascript" charset="utf-8">
  var i, list = document.getElementsByClassName("show-more");
  for (i = 0; i < list.length; ++i)
   {
     list[i].onclick();
   }
</script>
</body>
</html>

score 1 · Answer 2 · answered Apr 20 '14 at 06:32

1

did you try this? with onclick() method

var i, list = document.querySelectorAll(".show-more")
for (i = 0; i < list.length; ++i) 
{
  list[i].onclick();
}

Best regards

answered Apr 20 '14 at 06:32

Chloe Tsui

57
5

I think what we need is to wait until page loads, because if we manually click on the .show-more before the page loads, nothing happens. – Sam-Bo Apr 20 '14 at 06:38
well, you should use this: document.onload = function(){/*code here*/} – Chloe Tsui Apr 20 '14 at 06:54

score 0 · Answer 3 · edited May 23 '17 at 11:57

There is no built-in, cross-browser function or method to cause a click. One of the best cross-browser solutions I use if ever needed can be found here. Althrough, if you're trying to cause a function to fire it would be best to just call the function.

As per Luxelin's suggestion, jQuery would be the easiest alternative. When using jQuery $(element).trigger('click') would fire a cross-browser click event on the element.

score 0 · Answer 4 · answered Apr 20 '14 at 05:46

0

Though there is a way which you can use:

 element.onclick = function(){ .. };

 if( something )
      element.onclick(); // call the handler

DEMO

answered Apr 20 '14 at 05:46

Gaurang Tandon

6,504
11
47
84

@Sam-Bo The base code is here http://jsfiddle.net/GaurangTandon/7vLn7/1/ . Now you can implement the necessary actions. – Gaurang Tandon Apr 20 '14 at 06:20
I have observed that I can't click on the .show-more but until the page load completely, so the code in [link](jsfiddle.net/GaurangTandon/7vLn7/1) does not work, maybe adding a delay. – Sam-Bo Apr 20 '14 at 06:34

Trigger click on a span

4 Answers4