javascript - Mouse Event Handling for an Element -
i made search box, coding this
<table id="searchbox" style="border:1px solid #555;"> <tr> <td> <input type="text" style="border:none" id="mytextbox" onclick="makeactive();" /> </td> <td> <select onclick="makeactive();"> <option>option 1</option> <option>option 2</option> <option>option 3</option> </select> </td> <td> <input type="submit" value="submit" /> </td> </tr> </table> functions
function makeactive() { document.getelementbyid("searchbox").style.border="1px solid #ff0000"; } function makeunactive() { document.getelementbyid("searchbox").style.border="1px solid #555"; } my requirement : code says when user either click textbox or selectbox table border changes shows searchbox active now, , i want when user click outside searchbox table function makeunactive() should called, tried use onblur="makeunactive();" within textbox script called when click selectbox or submit button wrong :(
edited
working finecheck answer below how did it
you should use onfocus property call active function.to make field inactive, call inactive function in onblur property.
working fine:
html
<table id="searchbox" style="border:1px solid #555;"> <tr> <td> <input type="text" style="border:none" onclick="makeactive()" onblur="makeunactive()"/> </td> <td> <select onclick="makeactive();" onblur="makeunactive()"> <option>option 1</option> <option>option 2</option> <option>option 3</option> </select> </td> <td> <input type="submit" value="submit" /> </td> </tr> </table> js
function makeactive() { document.getelementbyid("searchbox").style.border="1px solid red";} function makeunactive() { document.getelementbyid("searchbox").style.border="1px solid yellow"; }
Comments
Post a Comment