解决jequry使用keydown无法跳转的问题

时间:2022-03-06 07:13:02

0x00 问题描述

代码

<script>
$("document").ready(function() {
$("#button").click(function() {
$val = $("#input").val();
window.location.href = 'http://www.baidu.com/s?wd=' + $val;
}) $("#input").keydown(function(event) {
var keyCode = event.keyCode ? event.keyCode : event.which ? event.which : event.charCode;
if (keyCode == "13") {
$val = $("#input").val();
window.location.href = 'http://www.baidu.com/s?word=' + $val;
}
})
})
</script>

实现功能

在搜索框中输入问题,通过点击按钮和按下回车都可以跳转到百度搜索相应问题

主要问题

按下回车键,先可以在控制台里看到先跳转到百度搜索界面,但一瞬间又跳回到当前页面

0x02 解决方案

将keydown换成keyup

原理剖析

在jquery中按下按键(keypress)分为两部分:keydown和keyup,而在获取input值的时候是在keydown,也就是按键按下之后才开始获取,所以把跳转写在keydown中无法获取到input的值

解决jequry使用keydown无法跳转的问题的更多相关文章

  1. 解决vue单页路由跳转后scrollTop的问题

    作为vue的初级使用者,在开发过程中遇到的坑太多了.在看页面的时候发现了页面滚动的问题,当一个页面滚动了,点击页面上的路由调到下一个页面时,跳转后的页面也是滚动的,滚动条并不是在页面的顶部 在我们写路 ...

  2. js解决弹窗问题实现班级跳转DIV示例

    js解决弹窗问题实现班级跳转DIV 1.js代码如下: <%--实现班级跳转DIV--%>  <div id="displayClassDiv" style=&q ...

  3. 【技术贴】解决支付宝充值信用卡还款跳转到网上银行报错Error 404 - Not Found

    声明 : 本文在 GFDL 1.2 下发布,本文出处光大银行信用卡  http://bbs.090989.com/forum-186-1.html http://androidgao.blogspot ...

  4. jquery手写焦点轮播图-------解决最后一张无缝跳转第一张的问题

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. 解决微信浏览器禁止链接跳转到iTunes

    方法:微信页面通过safari浏览器打开 safari打开的时候进行跳转 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transition ...

  6. js判断当前页面是否有父页面,页面部分跳转解决办法,子页面跳转父页面不跳转解决 (原)

    //如果当前页面存在父页面,则当前页面的父页面重新加载(即子页面父页面连带跳转) if(top.location!=self.location){         window.parent.loca ...

  7. 解决iOS微信H5支付跳转微信后不返回App问题(Swift-WKWebview)(转)

    问题分析 正常的H5支付流程如下 按照上面的支付流程会出现 App -> 微信 -> 支付 -> 点击 完成 -> safari访问redirect_url设置的URL,这种流 ...

  8. 解决Maven项目总是回跳到jdk1&period;5的情况的方法

    一.在pom.xml中加入: <build> <plugins> <plugin> <groupId>org.apache.maven.plugins& ...

  9. 解决springmvc中使用redirect跳转后https变为http

    方法一:配置文件修改ViewResolver的 redirectHttp10Compatible 属性,这个属性是为了兼容 http1.0协议. <bean id="viewResol ...

随机推荐

  1. Creating a Table View Programmatically

    https://developer.apple.com/library/ios/documentation/UserExperience/Conceptual/TableView_iPhone/Cre ...

  2. Android 5&period;0新特性了解(一)----TabLayout

    1.在2015年的google大会上,google发布了新的Android Support Material Design库,里面包含了几个新的控件,其中就有一个TabLayout,它就可以完成Tab ...

  3. ylbtech-Unitity-CS&colon;Delegates

    ylbtech-Unitity-CS:Delegates 1.A,效果图返回顶部 Invoking delegate a: Hello, A! Invoking delegate b: Goodbye ...

  4. 10、SQL Server 内置函数、临时对象、流程控制

    SQL Server 内置函数 日期时间函数 --返回当前系统日期时间 select getdate() as [datetime],sysdatetime() as [datetime2] getd ...

  5. Mysql group&lowbar;concat

    select p.id,p.parent_id,group_concat(distinct(CONCAT("分类名称:",c.name)) order by c.id desc s ...

  6. Afianl加载网络图片&lpar;延续&rpar;

    上一页"已经谈到了如何使用Afianl网络负载的图片和下载文件,本文将继续介绍使用Afinal使用网络负载图片,主绑定listview采用: 看效果图: listview在滑动过程中没用明显 ...

  7. java第十二次作业

    1. 本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结多流与文件相关内容. 2. 书面作业 将Student对象(属性:int id, String name,int age,doubl ...

  8. Ironic几种不同的场景下的网络拓扑

    最近帮领导做了几页ppt,总结几种场景下ironic管理物理机网络的网络拓扑,简单做成一份文章记录下.只是方便自己记忆,没有认真修改.如果对ironic有一定了解,可以看下,加深理解. 1. vlan ...

  9. JSON&period;parse&lpar;&rpar;在火狐中的BUG

      //用sessionStorage解决load页面刷新问题 { //sessionStorage.removeItem("loadInfo"); var loadInfo=de ...

  10. Magic Number &lpar;zoj3622&rpar;

    Magic Number (zoj3622) Time Limit : 4000/2000ms (Java/Other)   Memory Limit : 65536/32768K (Java/Oth ...