0

我有一个带有两个按钮和一些文本输入的表单。默认情况下,如果您按下回车,它将“单击”第一个按钮。我想这样做,如果您在任一文本框中键入,如果您按下回车键,第二个按钮将是被点击的那个。

在下面的简化示例中,默认情况下按 Enter 将“单击”使用 facebook 按钮登录。即使在电子邮件或密码文本输入中输入了某些内容,也会发生这种情况。我希望这样,如果在电子邮件或密码输入中输入了某些内容,则按 Enter 将“单击”使用电子邮件/密码按钮登录。

<form>
    <button class="login-facebook">Log in with Facebook</button>
    <input type="text" class="email" placeholder="email"><br>
    <input type="password" class="password" placeholder="password"><br>
    <button class="login-password">Log in with email/password</button>   
</form>

目标类似于:

$('.email').add('.password').on('change', function() {
    $('.login-password').setToBeNewDefaultClickIfEnterIsPressed();   
});

其中setToBeNewDefaultClickIfEnterIsPressed()更改默认输入。

4

2 回答 2

2

请参阅:HTML 表单上的多个提交按钮 - 将一个按钮指定为默认按钮

您还可以将它们制作成单独的表格并使用它。也可以看看:preventDefault

于 2013-08-12T17:45:15.727 回答
0

尝试这个。

我输入了一个字段,让您可以选择您想成为默认按钮的按钮,只是为了展示它是如何工作的。如果该字段为空,则我设置了默认按钮 #2。

jsFiddle在这里

<html>
    <head>
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>

        <script type="text/javascript">
            var defaultbutt = 2;
            $(document).ready(function() {

                $('[id^=txt]').blur(function() {
                    if ($(this).val() != '') {
                        defaultbutt = $('#pickabutt').val();
                        if (defaultbutt=='') defaultbutt = 2;
                    }
                });

                $('#pickabutt').blur(function() {
                    defaultbutt = $('#pickabutt').val();
                    if (defaultbutt=='') defaultbutt = 2;
                });

                $(document).keypress(function(e) {
                    if(e.which == 13) {
                        $('#mybutt' + defaultbutt).click();
                    }
                });

                $('[id^=mybutt]').click(function() {
                    var num = $(this).val();
                    alert('You clicked button: ' + num);
                });

            }); //END $(document).ready()

        </script>
    </head>
<body>

    Login:<br /><input id="txtLogin" type="text" /><br />
    PWord:<br /><input id="txtPassword" type="password" /><br />
    <input type="button" id="mybutt1" value="One" />
    <input type="button" id="mybutt2" value="Two" />
    <input type="button" id="mybutt3" value="Three" />

    Default button Number:<br /><input id="pickabutt" type="text" /><br />

</body>
</html>
于 2013-08-12T18:09:36.490 回答