解决jequry使用keydown无法跳转的问题
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无法跳转的问题的更多相关文章
- 解决vue单页路由跳转后scrollTop的问题
作为vue的初级使用者,在开发过程中遇到的坑太多了.在看页面的时候发现了页面滚动的问题,当一个页面滚动了,点击页面上的路由调到下一个页面时,跳转后的页面也是滚动的,滚动条并不是在页面的顶部 在我们写路 ...
- js解决弹窗问题实现班级跳转DIV示例
js解决弹窗问题实现班级跳转DIV 1.js代码如下: <%--实现班级跳转DIV--%> <div id="displayClassDiv" style=&q ...
- 【技术贴】解决支付宝充值信用卡还款跳转到网上银行报错Error 404 - Not Found
声明 : 本文在 GFDL 1.2 下发布,本文出处光大银行信用卡 http://bbs.090989.com/forum-186-1.html http://androidgao.blogspot ...
- jquery手写焦点轮播图-------解决最后一张无缝跳转第一张的问题
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 解决微信浏览器禁止链接跳转到iTunes
方法:微信页面通过safari浏览器打开 safari打开的时候进行跳转 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transition ...
- js判断当前页面是否有父页面,页面部分跳转解决办法,子页面跳转父页面不跳转解决 (原)
//如果当前页面存在父页面,则当前页面的父页面重新加载(即子页面父页面连带跳转) if(top.location!=self.location){ window.parent.loca ...
- 解决iOS微信H5支付跳转微信后不返回App问题(Swift-WKWebview)(转)
问题分析 正常的H5支付流程如下 按照上面的支付流程会出现 App -> 微信 -> 支付 -> 点击 完成 -> safari访问redirect_url设置的URL,这种流 ...
- 解决Maven项目总是回跳到jdk1.5的情况的方法
一.在pom.xml中加入: <build> <plugins> <plugin> <groupId>org.apache.maven.plugins& ...
- 解决springmvc中使用redirect跳转后https变为http
方法一:配置文件修改ViewResolver的 redirectHttp10Compatible 属性,这个属性是为了兼容 http1.0协议. <bean id="viewResol ...
随机推荐
- Mahout fp-growth
FP-growth Apriori算法的一个主要瓶颈在于,为了获得较长的频繁模式,需要生成大量的候选短频繁模式.FP-Growth算法是针对这个瓶颈提出来的全新的一种算法模式.目前,在数据挖掘领域,A ...
- android ndk编译项目(android-ndk-16r1)
由于采用android-ndk-16r1版本的ndk来编译 编译的环境之类在这里省略,注意是最后编译的命令如下 Administrator@WIN-AF6P80LVIJ0 ~ $ cd $ANDROI ...
- Android Studio环境下搭建ReactNative
1.安装Android Studio首先肯定是 安装Android Studio(包含SDK)(国内推荐)ps:这里有一点要注意,需要为SDK配置环境变量,名称必须为ANDROID_HOME 2.安装 ...
- SpriteBuilder中如何给精灵添加帧动画
首先你必须准备若干幅图片,当然最好做成Smart Sprite Sheet. 打开一个CCB文件,并鼠标选择根节点的CCSprite对象. 保持前者选中且Timeline的当前时间点把手在最左边,然后 ...
- 初涉IPC,了解AIDL的工作原理及使用方法
初涉IPC,了解AIDL的工作原理及使用方法 今天来讲讲AIDL,这个神秘的AIDL,也是最近在学习的,看了某课大神的讲解写下的blog,希望结合自己的看法给各位同价通俗易懂的讲解 官方文档:http ...
- ActiveMQ系列之五:ActiveMQ的Transport
连接到ActiveMQ Connector:ActiveMQ提供的,用来实现连接通讯的功能.包括:client-to-broker.broker-to-broker. ActiveMQ允许客户端使用多 ...
- Globalization Guide for Oracle Applications Release 12
Section 1: Overview Section 2: Installing Section 3: Configuring Section 4: Maintaining Section 5: U ...
- PS 滤镜——扩散特效, 毛玻璃 效果
%%% Diffuse %%% 扩散效果 clc; clear all; addpath('E:\PhotoShop Algortihm\Image Processing\PS Algori ...
- bash编程语法自我总结
脚本2种执行方式: 1 直接执行,等于bash衍生一个子程序,当该子程序完成后,子程序内各项变量活动作不会传回父程序 2 利用source执行,直接在父程序中执行 X=/bin/xdo cmd 执行c ...
- Sublime Text3激活
Sublime Text 3激活 最近Sublime Text3总是自动将激活码移除,查了下解决办如下: 首先.修改hosts文件,路径位:C:\Windows\System32\drivers\et ...