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связывает элемент управления с <form>:

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

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

    Нужно только присвоить тот же id формы в атрибуте formэлемента.

    • 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