Note that there are some explanatory texts on larger screens.

plurals
  1. POSimulate clicks on options
    primarykey
    data
    text
    <p>For example, if you click <code>&lt;div id="click-object-2"&gt;&lt;/div&gt;</code> the option will switch to <em>Earth</em>, after that to <em>Please choose</em>, and finally back to <em>Earth</em> again.</p> <p>I made a gif to show what I'd like to accomplish:</p> <p><img src="https://i.stack.imgur.com/eYCKb.gif" alt="enter image description here"></p> <p><br /></p> <p>Anyone know of a Javascript that can do this?</p> <p><br /></p> <pre><code>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"&gt; &lt;html xmlns="http://www.w3.org/1999/xhtml"&gt; &lt;head&gt; &lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8" /&gt; &lt;title&gt;Simulate clicks on options&lt;/title&gt; &lt;/head&gt; &lt;style type="text/css"&gt; div { width:30px; height:30px; margin:4px; cursor:pointer; } #click-object-1{background-color:#F00;} #click-object-2{background-color:#0F0;} #click-object-3{background-color:#00F;} #click-object-4{background-color:#FF0;} &lt;/style&gt; &lt;body&gt; &lt;form action=""&gt; &lt;fieldset&gt; &lt;ul style="list-style:none;"&gt; &lt;li&gt; &lt;select id="select_items_first" name="SelectItemsFirst"&gt; &lt;option value="choose"&gt;Please choose&lt;/option&gt; &lt;option id="fireaway" value="xjakgd"&gt;Fire&lt;/option&gt; &lt;option id="groundearth" value="yuygas"&gt;Earth&lt;/option&gt; &lt;/select&gt; &lt;/li&gt; &lt;li&gt; &lt;select id="select_items_second" name="SelectItemsSecond"&gt; &lt;option value="choosemore"&gt;Please choose&lt;/option&gt; &lt;option id="watermelon" value="piowqe"&gt;Water&lt;/option&gt; &lt;option id="catchwind" value="mnbvzi"&gt;Wind&lt;/option&gt; &lt;/select&gt; &lt;/li&gt; &lt;/ul&gt; &lt;/fieldset&gt; &lt;/form&gt; &lt;div id="click-object-1"&gt;&lt;/div&gt; &lt;div id="click-object-2"&gt;&lt;/div&gt; &lt;br /&gt; &lt;div id="click-object-3"&gt;&lt;/div&gt; &lt;div id="click-object-4"&gt;&lt;/div&gt; &lt;/body&gt; &lt;/html&gt; </code></pre>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload