我可以使用 <input type="button" /> 提交表单值吗?

Posted

技术标签:

【中文标题】我可以使用 <input type="button" /> 提交表单值吗?【英文标题】:Can I submit form values using <input type="button" />? 【发布时间】:2013-09-19 18:30:41 【问题描述】:

我正在开发一个搜索引擎,我在使用 GETPOST 方法时遇到了一个非常严重的问题。

我使用&lt;input type="button" /&gt; 来避免每次按下按钮时页面都刷新。

按下按钮后,我将显示结果(google_map、monumet 图片、规格)。

现在的问题是我想通过按此按钮提交并显示表单值 + 结果(google_map、monumet 图片、规格)。

这是一个问题,因为&lt;input type="button" /&gt; 没有提交表单值,我真的被卡住了。

【问题讨论】:

使用javascript document.getElementById("myform").submit(); 问题是我已经在使用 javascript if button isset onMouseUp="getScriptPage('count_display','text_content','1')" 是否可以同时调用javascript函数? onMouseUp="getScriptPage('count_display','text_content','1'); script_page2(.....);" 【参考方案1】:

当然,这是一个适合您的工作示例:

index.php

<!DOCTYPE html>
<html>
<head>
    <title>Working Example</title>
</head>
<body>

<form id="search-form">
    <input type="text" name="text1" id="text1" value=""><br>
    <input type="text" name="text2" id="text2" value=""><br>
    <input type="text" name="text3" id="text3" value=""><br>
    <input type="button" id="search-button" name="search-button" value="search">
</form>

<div id="response"></div>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>
    $(document).ready(function()
        $('#search-button').click(function()
            $.ajax( 
                type: "GET",
                url: 'response.php',
                data: $('#search-form').serialize(),
                success: function(response) 
                    $('#response').html(response);
                
             );
        );
    );
</script>

</body>
</html>

response.php

<?php

echo "text1: " . $_GET['text1'] . "<br>";
echo "text2: " . $_GET['text2'] . "<br>";
echo "text3: " . $_GET['text3'] . "<br>";

echo "your response ...";

在响应中,您返回任何响应内容,以及表单字段。

【讨论】:

谢谢 arielcr,你能给我发一个你刚刚发给我的代码的工作示例吗?因为我尝试了自己,我认为我做错了什么 我用一个工作示例编辑答案。我忘了告诉你,你可以使用任何事件作为 ajax 响应,我以按钮的 click 事件为例。希望对您有所帮助! 非常感谢你,你是最棒的......你肯定会拯救我的一天......:-)【参考方案2】:
onClick="document.getElementById('FormName').submit();"

【讨论】:

我已经在使用 onMouseUp="getScriptPage('count_display','text_content','1')"......我可以在同一个输入中使用 onclick 和 onMouseUp 吗? @AntreasApostolou 自己尝试一下然后写下这条评论会花更少的时间......

以上是关于我可以使用 <input type="button" /> 提交表单值吗?的主要内容,如果未能解决你的问题,请参考以下文章

javascript怎么操作type=date的input,使得input显示的内容是我设定的时间。

html5中,input 的属性type="range",样式怎样美化

我可以使用 <input type="button" /> 提交表单值吗?

请教关于网页制作javascript的问题,可否使用document.write()再次输出"< script src="" type="text&quo

是否可以使用 <input type="file"> 来发布文件名而不实际上传文件?

在 React 中禁用 `<input type=number>` 的滚动