文本框的侦听事件

侦听事件
大概就是侦测一个文本框的实时动态, 只要有内容变化,都会实时的在另一个中显示这个文本框的内容
代码如下
1 先要有一个被侦听的文本框

<input  id="name" name="compusername" placeholder="请输入您的姓名" onblur="testname()"/>

这里由于需要提交 就携带了name值 还有一个验证

2 然后需要一个实时显示 被侦听文本框的值 的 一个标签

 <input type="hidden" class="form-control" id="name2"/>
 <div>
    <b>姓名:</b>
    <span id="showname2"><b>姓名</b></span>
 </div>

应该别的也能用 但是觉得丑 就用span了
注意 这里的文本框到现在也没明白是用来干嘛了 少了这个还不行

3然后就是重点了 开始侦听事件

    $('#name').on('input propertychange', function() {  
     $('#name2').next().find('#showname2').text($('#name').val());
 });

看代码的意思 大概就是 侦听name文本框 给这个框一个function方法
找到name2的文本框 和 showname2 的span标签
将name的值实时放入 进行显示

如果多个的话 目前只能复制复制在复制 见谅

猜你喜欢

转载自blog.csdn.net/qq_43021813/article/details/82188428