On the webpage, jquery is often used to return values in the window. When you move your mouse into an input box, a dialog box will pop up asking you to enter the value of this dialog box, now we use Jquery to implement this effect.
The following is the instance code:
<Script type = "text/javascript" src =" http://www.bkjia.com/ Uploads/Common/js/jquery. js? Ver = 2009.12.23 "> </script> <div> get value: <input type = "text" name = "inputname" id = "inputname"/> <div id = "getvalue" style = "display: none; "> <div id =" tl "> </div> <div id =" tr "> </div> <table style =" border: 1px solid # ccc; width: 500px; text-align: left; "> <thead> <tr> <th> number </th> <th> last name </th> <th> first name </th> </tr> </ thead> <tbody> <tr> <td> 2 </td> <td> xing </td> <td> ge </td> </tr> <td> 3 </td> <td> xingad </td> <td> gead </td> </tr> <td> 4 </td> <td> xingxing </td> <td> ge </td> </tr> </tbody> <tfoot> <tr> <td> number </td> <td> last name </td> <td> first name </td> </tr> </tfoot> </table> </div> <script> $ (document ). ready (function () {$ ("# inputname "). focus (function () {// alert ('focal '); $ ("# getvalue" detail .css ("display", 'block') // display the table. addClass ('hover '). find ('table tr '). dblclick (function () {// double-click the table trvar text =$ (this ). find ("td: eq (0 )"). text (); // obtain the first text value of table td // alert ($ text); $ ("# getvalue" display .css ('display', 'None '); // hide the table $ ("# inputname "). val (text); // value assignment Input}) ;}}) </script> <br/> <center> If the display effect is unavailable, press Ctrl + F5 to refresh the page, more webpage code: <a href =' http://www.bkjia.com/ 'Target = '_ blank'> http://www.bkjia.com/ </A> </center>
Tip: the code can be modified before running!