Home / Questions / 1784
Accepted
devconcept
Asked: 2020-12-25 12:52:59 +0800 CST 2020-12-25 12:52:59 +0800 CST

如何使用不在表单内的按钮提交？

  • 772

我有一个与下面的非常相似的表格。这只是一个演示，但它说明了我的怀疑。

<!DOCTYPE>
<html>
<head>
    <title>Formulario</title>
</head>

<body>
    <form id="CreateForm" action="/create" method="post">
        <div>
            <label for="campo1">Campo1</label>
            <input type="text" id="campo1" name="campo1">
        </div>
        <div>
            <label for="campo2">Campo2</label>
            <input type="text" id="campo2" name="campo2">
       </div>
    </form>

    <button type="submit">
        Enviar
    </button>
 </body>

</html>

当我单击按钮时，如何在不使用 javascript 的情况下提交表单？

html

3 Answers

  1. Best Answer

    在 HTML5 中引入了一种新机制，能够将表单元素（按钮、输入等）与表单分离。该属性form将控件与 a 相关联<form>：

    <form id="CreateForm" action="/create" method="post">
    <input type="text" name="foo" />
</form>

<button type="submit" form="CreateForm">Enviar</button>

    只需form在元素的属性中分配相同的表单id即可。

    • 19

  2. 另一种解决方案是：

        <form name="myform" action="#">
    Search: <input type='text' name='query' />
    <a href="javascript: submitform()">Search</a>
    </form>
    <script type="text/javascript">
    function submitform()
    {
      document.myform.submit();
    }
    </script>

    字体

    • 1

  3. 使用 jQuery 的另一种选择

    <script type="text/javascript">
  $(document).ready(function() {
    $("#myButton").on('click', (function() {
      $("#myForm").submit();
    });
});
</script>
    • 1