jQuery实现键盘回车搜索功能 及bug解决【一看就懂】

今天在实现回车搜索功能时,遇到了一些小问题,特记录在此,愿大家都没有bug

前端页面如下: 

jQuery关键代码如下:

//  为输入框添加绑定事件,文末有绑定事件使用说明
$("#goto").bind('keypress', function (event) {
    //  获取用户输入框中的值
    let val = $("#goto").val();
    //  当键码的值为13时也就意味着是回车,执行控制层方法
    if (event.keyCode == '13') {
        //  这里使用了bootstrap样式,用过的应该很好理解
        //  不用样式的写法为:location=‘getDoctorList?pageNum=' + val;
        power2('getDoctorList?pageNum=' + val);
    }
})

可以发现,关键在于回车键

event.keyCode == '13' (键盘的的第13个键码

以此类推,使用其他按键查询只需获取键盘对应的键码即可。

附上jQuery绑定事件的说明文档:

再附上三层框架代码:仅供参考,主要目的是展示参数的接收,箭头顺序为执行顺序

特别提醒如果使用bootstrap样式,实现回车搜索功能时,前端页面一定要把<form>标签删除,不然会出现bug。(当敲回车提交时会默认走form表单而导致样式错乱,令人头疼) 


如有错误,欢迎指正

Thanks

       

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

hah杨大仙

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值