javascript - 输入 key 表单提交因 HTML5 日期输入而失败

标签 javascript jquery html forms

我有一个小型 HTML 表单(下面的代码),它实际上分为两部分,我希望用户能够通过仅在其中一个部分中按 Enter 键(下面代码中的“输入”)来提交表单;显示属性由连接到表单第二部分中的选择的一些 JavaScript 来切换)。目前,我正在使用一些 jQuery/javascript(也在下面)来处理此问题,以将 Enter 键按下绑定(bind)到表单提交。

HTML:

<form id="form">
    <span id="input">
        <span id="text" style="display:inline">
            <input type="text">
        </span>
        <span id="dates" style="display:none">
            <input type="date" id="start">
            <input type="date" id="end">
        </span>
    </span>
    <select onchange="changeInput(this.options[selectedIndex].value)">
        <option value="1">option 1</option>
        <option value="2">option 2</option>
    </select>
</form>

还有 jQuery/javascript:

$(function(){
    $("#input").on("click", function(e){
        if(e.which == 13){
            $("#form").submit();
        }
    });
});

当显示文本输入时,效果很好。然而,当显示日期输入时,回车键不起作用。无论浏览器显示 native 日历小部件,还是在不支持日期输入类型(由另一位 jQuery/javascript 处理)的浏览器中将输入替换为 jQueryUI 日期选择器小部件,都会出现这种情况。

知道为什么会发生这种情况吗?我知道我可以通过添加隐藏的提交按钮并覆盖表单第二部分的回车键行为来解决这个问题,但我想先了解发生了什么。

最佳答案

对于 click 事件 e.which 可以是 1、2 或 3(来自 jQuery docs)。

例如,对于鼠标左键单击,它应该是:

if (e.which == 1)

关于javascript - 输入 key 表单提交因 HTML5 日期输入而失败,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25642667/

相关文章:

jquery - 动画背景大小 : zoom to background-size: 110%

HTML 背景附件属性在 IE8 中不起作用

javascript - Google map API v3 上缺少 KML 标记 : What's wrong?

Javascript 类继承无法正常工作

javascript - jQuery 单击外部元素可向上或向下移动包含选中复选框的无序列表项

javascript - 将数组参数传递给 XMLHttpRequest 对象

javascript - jquery/javascript - 如果包含图像损坏则隐藏 div

jquery css 图片溢出隐藏左转

javascript - 使用 javascript 或 ruby​​ 分割此字符串

javascript - 无法通过在tensorflow.js中加载预训练模型(loadLayersModel)进行预测