How to simulate click event on an input box

I am trying to simulate click on an input box. When its clicked manually, a drop down auto suggestion box appears as suggestions about past searches. However, when I try to simulate the click programmatically, I'm getting the error that 'object doesn't support click method'. Is there any other way to do this? All I want is the click event and the auto suggestion box to drop down. Btw, this is Gmail's Search Mail input box on their mailbox that I am trying to play around with through web console.

I have tried to call click function through className, but it gives me the error of either undefined or object doesn't support click. This is the widget that I am talking about:

  <input name="q" class="gb_cf" aria-haspopup="true" aria-owns="gs_sbt50" aria-live="off"  dir="ltr" spellcheck="false" aria-label="Search mail" type="text" placeholder="Search mail" value="" autocomplete="off">

  <input disabled="" class="gb_cf" id="gs_taif50" dir="ltr" autocomplete="off">

Few things that I have tried:

    document.getElementbyClassName("gb_cf")[0].click(); 
    document.getElementbyName("q")[0].click();
    document.getElementbyId("gs_taif50").click();

None of them work. Any ideas?

Answers:

Answer

You need to .focus() instead of .click()

document.getElementbyClassName("gb_cf")[0].focus(); //or
document.getElementbyId("gs_taif50").focus();
Answer

If you want to use pure/native javascript, you can use the onfocus attribute of the input element to call a Js function.

<script>
    function showButton(){
    document.getElementById('mybutt').style.display = "block";
}
</script>

<body>
    <input id="myinp" type="text" placeholder="place" onfocus="javascript:showButton()"/> 
    <button id="mybutt" style="display:none;">OK</button>
</body>

In the above file, you should see the "OK" button appear when you click on the input field.

Tags

Recent Questions

Top Questions

Home Tags Terms of Service Privacy Policy DMCA Contact Us

©2020 All rights reserved.