javascript - 在特定文本字段中如何让输入单击按钮

标签 javascript jquery html css forms

我之前问过这个问题,但是似乎没有人理解我的要求

我有一个有两个按钮的表单。第一个按钮是一个 input type="button",它只是取消隐藏一个隐藏的 div。这个隐藏的 div 包含另一个类型为“提交”的按钮。在隐藏 DIV 之前。有一个用户名和密码字段 - type="text"。我希望用户能够输入用户名和密码,然后单击回车键以按下登录按钮,而不必移动鼠标并单击。问题是,当前在按下回车键时提交了整个表单并且隐藏的 div 没有显示,这是一个问题,因为隐藏的 div 包含另一个输入,它是一个特殊的验证 pin。

<form action="/loginaction.php" method="post" name="submit" id='submit'>
<label for="userAccountName">username</label><br>
                <input class="textField" type="text" name="username" 
id="userAccountName" maxlength="64" tabindex="1" value=""><br>&nbsp;<br>
                <label for="userPassword">Password</label><br>
                <input class="textField" type="password" name="password" 
id="userPassword" autocomplete="off" maxlength="64" tabindex="2"><br>
<input class="btn_green_white_innerfade btn_medium" type="button" 
name="submit" id="userLogin" value="Sign in" width="104" height="25" 
border="0" tabindex="5" onclick="showDiv();">

第二个提交按钮在这里

<div id="showme" class="newmodal" style="position: absolute; z-index: 1000; 
max-width: 561px; left: 700px; top: 263px; display: none;">
            <div class="modal_buttons" id="login_twofactorauth_buttonsets">
        <div class="auth_buttonset" 
 id="login_twofactorauth_buttonset_entercode" style="">
            <button type="submit" class="auth_button leftbtn" data-
modalstate="submit" onsubmit="submitForms();">

                <div style="text-align: left" 
class="auth_button_h3">submit</div>
                <div style="text-align: left" class="auth_button_h5">my 
authenticator code</div>          
    </button></div>

https://jsfiddle.net/7edwsvat/

总而言之,我希望用户在用户名或密码字段中能够单击 enter,这将取消隐藏 div。不过,我仍然希望使用回车键在下一个 div 中提交表单。

如果有人可以,仍然需要帮助

最佳答案

我刚刚为回车键添加了一个处理程序,如下所示:

$('body').on('keypress', function(e) {

     if(e.which == 13) {
        showDiv();
    }
});

我已经更新了 jsfiddle https://jsfiddle.net/7edwsvat/2/现在触发您想要的功能。但是,showDiv()函数中的一些函数逻辑不正确,我也更新了这个。

附带说明一下,我将 jquery 添加到元素中,以便更轻松地选择内容。

希望这对您有所帮助。

关于javascript - 在特定文本字段中如何让输入单击按钮,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45519517/

相关文章:

JQuery, CSS, 使用 show 的错误布局

html - 如何将 Internet Explorer 中的数据 URI 用作 URL?

javascript - 如何在提交时进行 ajax 调用并确保 html5 验证也发生

javascript - 基于切换时删除/添加类

c# - 我的oauth2回调页面可以是同一个html页面吗?我如何获得 token ?

jquery - YouTube API-通过Ajax上传视频

PHP 提交表单,转义引号?

JavaScript:为什么 .forEach 不起作用?

javascript - Highcharts ; x轴缩放问题

javascript - react 等待服务器响应