修改输入格式后如何提交html表单？

Question

我有一个简单的html表单，正在尝试将json格式的输入发布到端点。

如何获取要使用jsonInputs提交的表单？

 jQuery(document).ready(function($) { $('[contact-form]').on('submit', function(e) { e.preventDefault(); jsonInputs = $(this).serializeArray().reduce(function(a, x) { a[x.name] = x.value; return a; }, {}); console.log(jsonInputs); }); });

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> <form method="post" name="emailform" action="/rest/contact" contact-form> <div class="form-row"> <div class="form-group col-md-6"> <label for="inputName">Name</label> <input type="text" name="name" class="form-control" id="inputName" placeholder="Name" maxlength="50"> </div> <div class="form-group col-md-6"> <label for="inputEmail">Email</label> <input type="text" name="email" class="form-control" id="inputEmail" placeholder="Email"> </div> </div> <div class="form-group"> <label for="inputMessage">Message</label> <textarea type="text" name="message" class="form-control" id="inputMessage" placeholder="Message"></textarea> </div> <button type="submit" name="submit" value="submit" class="btn btn-primary">Submit</button> </form>

Answer 1

我认为这样可以帮助您

<html>

<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
    <script>
        jQuery(document).ready(function ($) {
            var xhttp = new XMLHttpRequest();
            $('[contact-form]').on('submit', function (e) {
                e.preventDefault();
                var x = document.getElementById('contact-form');
                var json = {
                    "name" : x.elements[0],
                    "email": x.elements[1],
                    "message": x.elements[2]
                }
                xhttp.open("POST", "/rest/contact", true);
                xhttp.send();
            });
        });
    </script>
</head>

<body>
    <form id='contact-form' method="post" name="emailform" action="/rest/contact" contact-form>
        <div class="form-row">
            <div class="form-group col-md-6">
                <label for="inputName">Name</label>
                <input type="text" name="name" class="form-control" id="inputName" placeholder="Name" maxlength="50">
            </div>
            <div class="form-group col-md-6">
                <label for="inputEmail">Email</label>
                <input type="text" name="email" class="form-control" id="inputEmail" placeholder="Email">
            </div>
        </div>

        <div class="form-group">
            <label for="inputMessage">Message</label>
            <textarea type="text" name="message" class="form-control" id="inputMessage" placeholder="Message"></textarea>
        </div>

        <button type="submit" name="submit" value="submit" class="btn btn-primary">Submit</button>
    </form>
</body>

</html>

修改输入格式后如何提交html表单？

问题描述

1 个解决方案

解决方案1
0 2018-07-10 12:58:08

修改输入格式后如何提交html表单？

问题描述

1 个解决方案

解决方案1 0 2018-07-10 12:58:08

解决方案1
0 2018-07-10 12:58:08