使用jQuery Ajax传递数据？

Question

我有下面的HTML页面：

<!DOCTYPE html>
<html lang="en">
    <head>

        <title>HTML</title>

        <script src="http://code.jquery.com/jquery-latest.min.js"></script>

        <script>
            $(document).ready(function() {
                $("#b1").click(function(event) {
                    $.ajax({
                        type : "POST",
                        url : "index.php",
                        data : "valx=2",
                        contentType : "application/x-www-form-urlencoded",
                        dataType : "text",
                        complete : function() {
                            alert('post completed');
                        },
                        error : function() {
                            alert('error condition');
                        },
                        success : function(data) {
                            $('.result').html(data);
                            alert('data is returned');
                        },

                        statusCode : {
                            200 : function() {
                                alert("page was found");
                            }
                        }

                    });
                    event.preventDefault();
                });
            });
        </script>
    </head>

    <body>
        <div>
            <button id="b1">
                Click Me!
            </button>
        </div>
        <div class="result"></div>

    </body>
</html>

然后，我有以下php页面：

<?php
     $my_string =  $_REQUEST["valx"]; 
     $my_string = $my_string +9;
     echo $my_string;
?>

一切都按原样完美运行，但是我试图弄清楚如何将发布数据更改为表单：

 data: '{ valx:"2"}'

这就是它的坏处。 我尝试了多种形式的数据：'{valx：“ 2”}'仍然没有运气。 似乎php脚本无法正确获取数据。 另请注意，使用这种格式似乎也需要更改contentType : "application/x-www-form-urlencoded", 。

因此，问题是如何传递表单data: '{ valx:"2"}'并返回11的响应？

谢谢，吉姆

Answer 1

data参数接受var=value&var1=value1形式，或带有键/值的JavaScript对象。 您已经给了它，这是一个字符串...

data: '{ valx:"2"}`

...当您应该给它一个真实的JS对象时：

data: { valx:"2"}

Answer 2

使用对象而不是字符串。 jQuery会将对象解析为表单编码格式。 还要完全删除contentType选项，因为这不是要发送的数据类型，而是用于接收的数据，您将接收text / html

 data : { valx:"2"},

使用jQuery Ajax传递数据？

问题描述

2 个解决方案

解决方案1
3 已采纳 2013-01-06 16:26:17

解决方案2
0 2013-01-06 16:27:31

使用jQuery Ajax传递数据？

问题描述

2 个解决方案

解决方案1 3 已采纳 2013-01-06 16:26:17

解决方案2 0 2013-01-06 16:27:31

解决方案1
3 已采纳 2013-01-06 16:26:17

解决方案2
0 2013-01-06 16:27:31