Javascript 隐藏 HTML 表单的提交按钮

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/11525726/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-24 06:10:55  来源:igfitidea点击:

Hiding an HTML Form's Submit Button

phpjavascripthtml

提问by Trent Scott

Possible Duplicate:
Getting a form to submit when the enter key is pressed when there is no submit button

可能的重复:
在没有提交按钮的情况下按下回车键时提交表单

I'm trying to implement a text input box with an invisible submit feature. As such, the field has no submit button attached and is submitted when the "enter" key is pressed.

我正在尝试实现一个带有隐形提交功能的文本输入框。因此,该字段没有附加提交按钮,并在按下“输入”键时提交。

Here's an example of how I want the code to function:

这是我希望代码如何运行的示例:

<form method="get" action="<?php bloginfo('home'); ?>/"><p>

<input class="text_input" type="text" value="SEARCH: type &amp; hit Enter" name="s" id="s" onfocus="if 
(this.value == 'SEARCH: type &amp; hit Enter') {this.value = '';}" onblur="if (this.value == '') 
{this.value = 'SEARCH: type &amp; hit Enter';}" />

<input type="hidden" id="searchsubmit" value="" /></p></form>

Here's the code I can't get to work:

这是我无法开始工作的代码:

<p>Have us call you. Input your number:</p>
<input type="text" id="phone" name="phone" maxlength="10" size="10">
<input type="submit" value="Click-to-Call"  onclick="window.open('http://secure.ifbyphone.com/clickto_status.php?click_id=34124&phone_to_call=' + getElementById('phone').value + '&key=asdfjknj3459dj38sdka92bva', 'Clickto' , 'width=200,height=200,toolbar=no,location=no, menubar=no, scrollbars=no, copyhistory=no,resizable=no')">

I've tried adding the form attribute with a GET request to the URL in the "onclick" portion to no avail.

我尝试将带有 GET 请求的表单属性添加到“onclick”部分中的 URL 中,但无济于事。

Any thoughts on how to make this work?

关于如何使这项工作的任何想法?

回答by Jeff Noel

add this to your css regarding ID searchsubmit:

将此添加到有关 ID searchsubmit 的 css 中:

    #searchsubmit
    {    
        visibility: hidden;
    }

The button will still work but will not be visible. The enter action should work by default if the form's input is focused/used.

该按钮仍然有效,但将不可见。如果表单的输入被聚焦/使用,则输入操作应该默认工作。



The onBlur function could be triggering the actions you want to. onBlur occurs when the user leaves the input field (clicking away)

onBlur 函数可能会触发您想要的操作。当用户离开输入字段(点击离开)时发生 onBlur

You could try using JQuery:

您可以尝试使用 JQuery:

$(function() {
$('form').each(function() {
    $('input').keypress(function(e) {
        // Enter pressed?
        if(e.which == 10 || e.which == 13) {
            this.form.submit();
        }
    });

    $('input[type=submit]').hide();
});

});

});

This will trigger the onSubmit event of your form, but you could change

这将触发表单的 onSubmit 事件,但您可以更改

this.form.submit

for

为了

$('#phone').blur()

http://api.jquery.com/blur/

http://api.jquery.com/blur/



Try adding a javascript script block with this:

尝试添加一个 javascript 脚本块:

   document.getElementsById('phone')[0].onkeydown= function(event)
{
    if (event == undefined)
    {    
        event = window.event;
    }

    if (event.keyCode == 13)
    {
        var js_phone = document.getElementsByName('phone')[0].value;
        window.location = 'myPage.php?phone='+js_phone;
        return false;
    }
};

回答by starbeamrainbowlabs

To hide something, you could use the following code:

要隐藏某些内容,您可以使用以下代码:

input[type=submit]
{
    display:hidden;
}

The input[type=submit]is just there as an example, replace it with selector for you submit button.

input[type=submit]是就在那里作为一个例子,有选择取代它对于您所提交按钮。

Hope this helps.

希望这可以帮助。