两个input,一个在其中一个输入,内容在另一个input中实时回显
代码如下
<!DOCTYPE html> <html> <head> <title>demo.html</title> <meta name="keywords" content="keyword1,keyword2,keyword3"> <meta name="description" content="this is my page"> <meta name="content-type" content="text/html; charset=UTF-8"> <script src="http://code.jquery.com/jquery-2.1.0.min.js"></script> <link href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"> <script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script> </head> <body> <div style='padding:100px;width:60%'> <div> <h3>一个input联动的demo</h3> </div> <hr> <div> <div>id为master的input</div> <input id='master' type='text' class='form-control'> </div> <div> <div>id为slave的input</div> <input id='slave' type='text' class='form-control'> </div> </div> </body> <script type="text/javascript"> $(function() { $('#master').keyup(function() { //master键入过程中的监听函数 var me = $(this); //获取master的input var val = me.val(); //获取master的input的val $('#slave').val(val); //将master中键入的内容实时的拿到slave中; }) }) </script> </html>
效果如下