0.JS

作者: 压根儿没快乐过 | 来源:发表于2017-06-15 17:12 被阅读0次

0.表单：

HTML

<form id='test' >
    <input type='submit' value='提交'>
</form>

jQuery代码：

var  myForm = $('#test).submit(function() {
    $.ajax({
         url: '提交的URL',
         type: 'post',//提交的方式
         dataType:'json'
         data: myForm.serializeArray(),
         success: function(msg) {
                //这是成功返回的数据，写自己的逻辑
            }
      });

1.查处隐藏的或者是不隐藏的

图像 9.jpg

2.jQuery获取表单中的数据

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="jquery-3.1.1.min.js"></script>
    <script>
        $(function() {
            $('#submit').click(function() {
                var d = {};
                var t = $('form').serializeArray();
                $.each(t, function() {
                    d[this.name] = this.value;
                });
                alert(JSON.stringify(d));
            });
        });
    </script>

</head>
<body>

<form>
    <input id="a1" type="input" value="" name="a1"><br>
    <input id="a2" type="input" value="" name="a2"><br>
    <input id="a3" type="input" value="" name="a3"><br>
    <input id="a4" type="input" value="" name="a4"><br>
    <select id="ax" name="ax">
        <option value="0">选项1</option>
        <option value="1">选项2</option>
    </select><br>
    <input id="submit" type="button" value="提交" name="submit">
</form>

</body>
</html>

3.js获取表单中的数据

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="jquery-3.1.1.min.js"></script>
    <script>
        // 如：{Name:'摘取天上星',position:'IT技术'}
        // ps:注意将同名的放在一个数组里
        function getFormJson(form) {
            var o = {};
            var a = $(form).serializeArray();
            $.each(a, function () {
                if (o[this.name] !== undefined) {
                    if (!o[this.name].push) {
                        o[this.name] = [o[this.name]];
                    }
                    o[this.name].push(this.value || '');
                } else {
                    o[this.name] = this.value || '';
                }
            });
            return o;
        }

        //调试调用
        $(function(){
            $("#button").click(function(){
                console.log(getFormJson("#formID"));
            });
        });
    </script>

</head>
<body>

<form id="formID">
    姓名 <input value="摘取天上星" name="Name" />
    职位 <input value="IT技术" name="position" />
    <input id="button" value="提交" type="button" />
</form>

</body>
</html>