前些时间在做一个搜索功能时发现一个比較有意思的现象,场景是这种:在一个模态窗体中是一个订单列表。页面的顶部有若干个状态筛选框和一个搜索keyword输入框,当焦点在keyword输入框时按回车,本来是对input的keyup事件做了监听。当发现是按了回车键时便自己主动提交搜索请求的,但输入keyword后按回车时页面居然跳转了。而且出现“HTTP 错误 405.0 - Method Not Allowed无法显示您正在查找的页面。由于使用了无效方法(HTTP 谓词)”的错误,很纳闷。

依照错误信息及现象(页面跳转了)来看。应该是由于触发了页面提交了。但其实。当在keyup事件里面alert时,根本还没有运行到keyup事件里面去就已经跳转了。

于是搜索了一些资料来看。结果发现html规范的一种约定:假设一个form里仅仅有一个input。那么不管有无submitbutton或绑定事件,仅仅要在这个焦点在这个input里而且按下回车button时,都会运行自己主动提交表单的操作。看到这里。我恍然大悟了。

找到了原因。解决的办法也就出来了。自己主动提交的动作本身浏览器在默认事件中绑定的,按键盘的操作就是keyup和keydown,我原本的按键监听是在keyup事件里写的。所以把keydown事件重写,然后终止默认事件运行就OK了。我的代码例如以下。供遇到相同问题的朋友參考:

/**
* 关键词输入框回车事件触发搜索
*/
win.find('input[name="keyword"]').bind('keyup', function(e){
var ev = document.all?window.event:e;
if(ev.keyCode === 13){
$("a.search", win).click();
}
}).bind('keydown', function(e){
var ev = document.all?window.event:e;
if(ev.keyCode === 13){
return false;
}
});

在input中回车后页面提交导致出现HTTP 错误 405.0 - Method Not Allowed的更多相关文章

  1. Asp.Net Core IIS发布后PUT、DELETE请求错误405.0 - Method Not Allowed 因为使用了无效方法(HTTP 谓词)

    一.在使用Asp.net WebAPI 或Asp.Net Core WebAPI 时 ,如果使用了Delete请求谓词,本地生产环境正常,线上发布环境报错. 服务器返回405,请求谓词无效. 二.问题 ...

  2. HTTP 错误 405.0 - Method Not Allowed 无法显示您正在查找的页面,因为使用了无效方法(HTTP 谓词)。

    x 前言:报错信息 HTTP 错误 405.0 - Method Not Allowed 无法显示您正在查找的页面,因为使用了无效方法(HTTP 谓词). 发送至 Web 服务器的请求使用了为处理该请 ...

  3. 程序中使用ajax时,type为put,或者delete时在 IIS上没效果,发生HTTP Error 405.0 - Method Not Allowed

    其实使用put delete  是在创建webapi中基本才会使用. WebDAV 是超文本传输协议 (HTTP) 的一组扩展,为 Internet 上计算机之间的编辑和文件管理提供了标准.利用这个协 ...

  4. [环境搭建]-Web Api搭建到IIS服务器后PUT请求返回HTTP Error 405.0 - Method Not Allowed 解决方法 转摘:http://blog.csdn.net/qiujuer/article/details/23827531

    尝试使用微软的Web Api,他的确是一个很有意思的东西. 让我体会到了许多的方便,但是我发现部署到IIS服务器上去了后PUT和Delete请求将返回405. 原因是IIS的默认处理程序默认情况下只允 ...

  5. HTTP Error 405.0 - Method Not Allowed 无法显示您正在查找的页面,因为使用了无效方法(HTTP 谓词)。

    将submit改成button即可   因为触发了form表单

  6. input中空格后的数据不显示

    bug,input中空格后的数据不显示     昨天在修bug,有一个bug是用户修改的个人信息的地址栏,输入有空格的话,空格后面的内容存不上,而且没有报错,奇怪了,只好跟踪下. 页面上的输入框就是个 ...

  7. ASP.Net WebAPI HttpDelete/PUT方法运行或发布到生产服务器上后出现405(Method Not Allowed)错误的解决办法

    原文:ASP.Net WebAPI HttpDelete/PUT方法运行或发布到生产服务器上后出现405(Method Not Allowed)错误的解决办法 本文只是个人的理解和学习记录,如果觉得本 ...

  8. 【转载】input 中 type='text' 的提交问题

    原文链接:http://www.nowamagic.net/html/html_AboutInputSummit.php 有时候我们希望回车键敲在文本框(input element)里来提交表单(fo ...

  9. 阻止form元素内的input标签回车提交表单

    <form></form>标签内input元素回车会默认提交表单. 阻止回车默认提交表单: $('form').on('keydown', function (event) { ...

随机推荐

  1. AIX常用命令汇总(转)

    在本文中,我将讨论这其中的一些核心命令.其目的旨在为您提供一个可用作便捷参考的列表.虽然这些命令的行为在所有 AIX 版本中都应该相同,但是仅在 AIX 5.3 下对它们进行了测试. 注意:以下段落中 ...

  2. 工具-Memcahce和Redis比较

    一.Memcache 1.     memecache 把数据全部存在内存之中,断电后会挂掉,数据不能超过内存大小redis有部份存在硬盘上,这样能保证数据的持久性. 2.      Memcache ...

  3. VC6.0设置注释快捷键

    第一步:工具栏上右键选择Customize(定制),选择“Add-ins and Macro Files(附加项和宏文件)”页,把SAMPLE前面打上钩. 第二步:选择“Commands(命令)”页, ...

  4. leetcode185 Department Top Three Salaries

    Employee表存储员工姓名.员工所在公寓.员工工资 Department表存储公寓id 评选出各个公寓的工资前三名的员工. 遇到的问题如下: limit,in等语句不能用在嵌套select语句中, ...

  5. Setting up a static IP address in Ubuntu

    sudo gedit /etc/network/interfaces Change the line iface eth0 inet dhcp to iface eth0 inet static an ...

  6. 配置Kafka集群和zookeeper集群

    原文链接请参见:http://www.cnblogs.com/5iTech/articles/6043224.html

  7. oc 目录结构

    最顶级的oc2是一个项目名,下级的oc2下面的文件是一些程序文件(.m或者.h的文件)和一些界面文件(.xib或者storyboard文件),supporting files文件下面的是资源文件,可以 ...

  8. 为 Blade 模板引擎添加新文件扩展名

    因为一些原因,我准备把 Blessing Skin 的框架换成 Laravel 了(之前是自己搭建的一个框架),但是在模板迁移的时候遇到了一点问题. 之前我是使用的 XiaoLer/blade 这个从 ...

  9. unity5 Orthographic模式相机视截体尺寸计算

    一,通过编辑器中数值计算. 如图,相机为Orthographic模式,其camera size为5.57,是什么含义呢,经过测量,发现视图中视截体的高度是5.57x2. 那么视截体的宽度怎么决定呢? ...

  10. Server Process

    1.client进行update操作后.其它是怎么协作的? Client进行update操作之后,是由Server Process真正完毕的,分以下几步: 1).须要更新的数据在Data buffer ...