当按下输入时，隐藏的提交按钮不会在chrome中提交

I have a problem with a hidden submit button. I have an input field I use for an Ajax(jQuery) chat, people should enter text and press enter to submit. This works fine in Firefox but not in chrome, I think it treats it as if it's not there.

我有一个隐藏的提交按钮的问题。我有一个用于Ajax（jQuery）聊天的输入字段，人们应该输入文本并按回车键提交。这在Firefox中运行良好但在chrome中不行，我认为它将其视为不存在。

I'm using the following code:

我正在使用以下代码：

$('#CommentChatForm').submit(function(event){ 
    ...
}

And I use this to hide the submit button:

我使用它来隐藏提交按钮：

$('#CommentChatForm input:submit').hide();

Which makes the HTML look like this:

这使得HTML看起来像这样：

<div class="submit">
    <input type="submit" value="Submit" style="display: none;">
</div>

I've also tried using keypress() by adding the following on top:

我还试过通过在顶部添加以下内容来使用keypress（）：

$('#CommentMessage').keypress(function(e){
    if(e.which == 13){
        $('#CommentChatForm').submit();
    }
})

This makes it work fine in Chrome but in Firefox it causes it to submit twice instead of once.

这使得它在Chrome中运行良好，但在Firefox中它会导致它提交两次而不是一次。

5 个解决方案

#1

If you use the keypress handler you won't need the hidden submit button, so just remove it.

如果您使用按键处理程序，则不需要隐藏的提交按钮，因此只需将其删除即可。

#2

Sometimes you don't have control of HTML being generated by some widget or a module, so you style things with CSS. This was the case with me too. If found that in Chrome it works if you use

有时您无法控制某些小部件或模块生成的HTML，因此您可以使用CSS设置样式。这也是我的情况。如果在Chrome中发现它可以使用

visibility:hidden;

visibility：hidden的;

but not if you use

但如果你使用，请不要

display:none;

显示：无;

In FireFox it works either way. Hope this will be helpful to somebody.

在FireFox中，无论哪种方式都可以。希望这对某人有所帮助。

#3

If you don't want to display it, then don't add it in html.

如果您不想显示它，请不要在html中添加它。

html:

HTML：

<form id="form" onsubmit="my_submit()">
<input type="text" id="msg" />
</form>

javascript:

JavaScript的：

function my_submit(){
    var msg = $('#msg').val();
    ....
    submit_on_my_own(msg);
    ...
    return false;
}

#4

I'm doing this way and without Submit button.

我这样做，没有提交按钮。

$(document).ready(function()
{
    $('#Username').keypress(function(e){
        if(e.which == 13){
            $('#CheckLogin').submit();
            }
        }); 
    $('#Password').keypress(function(e){
        if(e.which == 13){
            $('#CheckLogin').submit();
            }
        });
});

#5

-1

works for me in chrome

在chrome中为我工作

http://jsfiddle.net/qEAeN/

might need to double check your js

可能需要仔细检查你的js

#1