javascript-ajax 获取表单内容然后传递PHP

问题描述

ajax 获取表单内容然后传递PHP

我之前一直在用DOM通过js提取表单内容给PHP做处理,其实也就相当于没用form。。

后来form的内容越来越多了,通过一个个getElementById来获取表单内容然后给PHP越来越不现实了

我在想能不能通过form原本的POST方式(或者有别的方式?)直接将表单内容变成数组,然后js获取数组之后在传递给后台PHP,然后PHP在解析数组做处理,这样做ajax?

可能以上描述不是很专业,忘大神谅解,非常感谢

解决方案

Sample

....

Jquery

$.ajax({
type: "POST",
url: 'url.php',
data: $('#frmSubmit').serialize(),
success: function (data) {
// your codes
}
});

PHP
与原有form POST 处理没区别。

解决方案二:

看这里http://www.w3school.com.cn/jquery/ajax_serialize.asp 要使用jQuery前端框架哦

解决方案三:

设置表单的target为隐藏iframe的name值,将表单提交到隐藏iframe来模拟ajax无刷新操作,或者倒入jquery框架,调用serialize方法即可将表单序列化为键值对字符串。

或者自己遍历表单也行



        function serializeForm(f) {//参数f为表单这个DOM对象
            var params = '', tmp;
            for (var i = 0; i < f.elements.length; i++) {
                if (f.elements[i].name) {
                    switch (f.elements[i].type) {
                        case 'hidden':
                        case 'password':
                        case 'text':
                        case 'textarea':
                        case 'select-one':
                            params += (params == '' ? '' : '&') + f.elements[i].name + '=' + encodeURIComponent(f.elements[i].value); break;
                        case 'select-multiple':
                            tmp = '';
                            for (var p = 0; p < f.elements[i].options.length; p++)
                                if (f.elements[i].options[p].selected) tmp += (tmp == '' ? '' : ',') + f.elements[i].options[p].value;
                            if (tmp != '') params += (params == '' ? '' : '&') + f.elements[i].name + '=' + encodeURIComponent(tmp); break;
                        case 'radio': case 'checkbox':
                            if (f.elements[i].checked) params += (params == '' ? '' : '&') + f.elements[i].name + '=' + encodeURIComponent(f.elements[i].value); break;
                    }
                }
            }
            return params;
        }

解决方案四:

会JQUERY就不存在getElementById的困扰了

解决方案五:

jQuery里有个serializeArray()方法,可以将表单数据整合成JSON,非常方便;或者使用serialize()方法整合成键值对字符串,也不错。

如此,使用PHP处理起来非常舒服~~~

请采纳!

解决方案六:

使用jq。
getElementById("myId")--》$("#myId")
如果是input,使用val()获取其值,设置值用val("设值")
用法:
$("#myId").val();
教程:
http://www.w3school.com.cn/jquery/jquery_dom_get.asp

时间: 2024-10-28 06:06:59

javascript-ajax 获取表单内容然后传递PHP的相关文章

Javascript获取表单名称(name)的方法_javascript技巧

本文实例讲述了Javascript获取表单名称(name)的方法.分享给大家供大家参考.具体如下: 下面的代码通过表单的name属性获得表单名称 <!DOCTYPE html> <html> <body> <form id="frm1" name="form1"> First name: <input type="text" name="fname" value="

asp.net获取表单的问题

问题描述 asp.net获取表单的问题 用户名:/asp:TextBox 密码:? /asp:TextBox protected void Page_Load(object sender, EventArgs e) { Response.Write("用户名:" + Request.Form["txtname"] + ""); Response.Write("密码:" + Request.Form["txtpassw

JavaScript获取表单内所有元素值的方法_javascript技巧

本文实例讲述了JavaScript获取表单内所有元素值的方法.分享给大家供大家参考.具体如下: 下面的JS代码可以遍历指定表单中的所有元素,并输出元素的值 <!DOCTYPE html> <html> <body> <form id="frm1" action="form_action.aspx"> First name: <input type="text" name="fname

Ajax中通过JS代码自动获取表单元素值的示例代码_AJAX相关

我们在使用Ajax的时候,通常需要获取表单元素值,然后发送给后台的服务器端程序处理.如果表单元素不多的情况我们常常会通过GET方式来获取表单元素值,但如果表单元素非常多,此时就需要用POST方式来获取表单元素值,那么如何来获取表单元素值呢?下面给出一段JS代码即可自动获取表单元素的值了. function getFormQueryString(frmID) //frmID是表单的ID号,请在表单form中先命名一个ID号 { var frmID=document.getElementById(f

JavaScript获取表单enctype属性的方法_javascript技巧

本文实例讲述了JavaScript获取表单enctype属性的方法.分享给大家供大家参考.具体如下: <!DOCTYPE html> <html> <body> <form id="frm1" enctype="text/plain"> First name: <input type="text" name="fname" value="Donald"&

VIEW层AJAX提交表单到Controller的实体(AJAX传递序列化的输入元素)

在MVC环境中,AJAX方式添加一个对象,这个对象在Models中是一个视图模型,在前台显示时是这样的代码:   <%using (Html.BeginForm())       { %>     姓名:<%=Html.TextBoxFor(model=>model.UserName) %>     Email:<%=Html.TextBoxFor(model=>model.Email) %>     年龄:<%=Html.TextBoxFor(mod

JavaScript获取表单内所有元素值的方法

 本文实例讲述了JavaScript获取表单内所有元素值的方法.分享给大家供大家参考.具体如下: 下面的JS代码可以遍历指定表单中的所有元素,并输出元素的值 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 <!DOCTYPE html> <html> <body> <form id="frm1" action="form_action.aspx"> First name:

JavaScript获取表单enctype属性的方法

 本文实例讲述了JavaScript获取表单enctype属性的方法.分享给大家供大家参考.具体如下:   1 2 3 4 5 6 7 8 9 10 11 12 13 14 <!DOCTYPE html> <html> <body> <form id="frm1" enctype="text/plain"> First name: <input type="text" name="f

Ajax中通过JS代码自动获取表单元素值的示例代码

我们在使用Ajax的时候,通常需要获取表单元素值,然后发送给后台的服务器端程序处理.如果表单元素不多的情况我们常常会通过GET方式来获取表单元素值,但如果表单元素非常多,此时就需要用POST方式来获取表单元素值,那么如何来获取表单元素值呢?下面给出一段JS代码即可自动获取表单元素的值了. function getFormQueryString(frmID) //frmID是表单的ID号,请在表单form中先命名一个ID号 { var frmID=document.getElementById(f