如何在没有按钮的情况下提交表单?

Posted

技术标签:

【中文标题】如何在没有按钮的情况下提交表单?【英文标题】:How to submit form without button? 【发布时间】:2016-08-29 18:02:03 【问题描述】:

我是新来的。我希望我的代码在没有提交按钮的情况下提交表单。我的代码运行如下: 每次用户在输入文本中输入数据并按回车时,结果将显示在输入文本下方的同一页面上。如果我使用提交按钮提交数据,此代码将完美运行。谁能帮我这个 ?提前致谢。

这是我的结果.html

$(document).ready(function()
$("#code").change(function()
    var st = '';
    $('#Myform input[type=text]').each(function()

        st = st+ '<td>'+$(this).val()+'</td>';
        $(this).val('');
    );
    $('#result').append('<tr>'+st+'</tr>');
);

);

html

<form id="Myform">
    <table>
        <tr>
            <td>
                <p>Code:</p>
            </td>
            <td><input id="code" type="text" name="code" size="40" autofocus/></td>
        </tr>
    </table>
</form>
<table id="result"></table>

这是我的代码.php

<?php if( $_REQUEST["code"] ) $code = $_REQUEST['code'];?>

【问题讨论】:

使用$('#formid').submit() Submit a form using jQuery的可能重复 如果在输入焦点时按下回车,默认行为已经是提交表单。目前尚不清楚您的问题/预期行为是什么?... @A. Wolff 假设我添加了一个输入提交按钮来提交表单。 。当用户在输入文本中输入“123”并单击提交按钮时,它将打印“123”。接下来当用户输入“456”并单击提交按钮时,它将在“123”下面的下一行打印“456”。但是如果用户输入“789”并按回车键,所有打印出来的结果都会消失,并且url后面会加上“?code=”。那么我该如何解决呢?我希望用户在没有提交按钮的情况下提交并打印每个结果。这是我面临的问题。谢谢 有人知道它为什么会这样吗?我想开发一个使用 php 实现这个概念的条码扫描系统。 【参考方案1】:

粗略的 Google 搜索会发现 jQuery 提供了执行此操作的方法。

您可以通过submit()trigger() 方法触发表单提交,即

$('#Myform').submit()

$('#Myform').trigger('submit')

前者只是后者的捷径。

【讨论】:

谷歌的力量。然而有些人仍然无法搜索它。 这已经是在表单的输入子项中按 Enter 的默认行为。所以不知道为什么你的回答会在这里有所帮助【参考方案2】:

你好吗?

如果你需要发送到另一个php页面,你可以发送AJAX,如果不想发送,你可以直接显示数据到你的js,不用ajax。

https://jsfiddle.net/5L9Leso8/

更新:

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>teste</title>
</head>

<body>
    <div>
        <label for="test">
            <input type="text" name="test" id="test">
            <p id="rest"></p>
        </label>
    </div>
    <script>
    $('#test').on('change', function(e) 
        e.preventDefault();
        var self = $(this);

        /** if you don't need to send to your php code 
        $('#rest').html(self.val());
        **/
        if (self.val().length > 0) 
            $.ajax(
                url: 'yourUrlphp',
                type: 'post',
                data: 
                    yourText: self.val()
                ,
                success: function(data) 
                    $('#rest').html(data);
                
            );
        
    );

    </script>
</body>

</html>

【讨论】:

你好,我试过这个没有php代码的代码,但它不能正常工作。 现在试试,有错误,不过我更新了这个脚本

以上是关于如何在没有按钮的情况下提交表单?的主要内容,如果未能解决你的问题,请参考以下文章

我们可以在没有提交按钮的情况下提交 PDF 表单吗?

如何在不刷新的情况下提交表单?

如何在没有单独的单击事件处理程序的情况下处理多个表单提交 [关闭]

如何在不提交的情况下使用 jQuery Validator 验证表单的第一部分?

如何在不提交表单的情况下使用struts2提交标签作为按钮?

如何在 Django 中访问表单提交按钮的值?