将动态jQuery帖子传递给PHP

时间:2011-12-04 19:36:32

标签: php javascript jquery json

您好我需要以下代码的帮助。我搜索了一些帖子和其他网站,但无济于事。

这是我正在构建的网站的精简版本,其中包含可使用CKeditor编辑的众多div的管理页面,因此序列化对我来说不是一个选项(我不认为)。当我对$.post索引进行硬编码并为内容使用变量时,我可以将数组传递给PHP。

这对一页来说没问题,但我有很多。因此,当我尝试将数组字符串构造为变量并将其作为第二个参数传递给$.post时,它会失败。 Firebug显示json被传递,虽然值是红色的(硬编码版本没有被识别为json!只是索引值)。我相信这只是一个语法问题,但我已经碰壁了。任何人都可以向我展示光明。

PHP处理程序尝试各种方法来读取POST。

带有js的动态HTML:

<html>
<head>
<title>jQuery POST Test</title>

<script type="text/javascript" src="jQuery.min.js"></script>
<script type="text/javascript">
function getElementsByClass(searchClass) {
    var classElements = new Array();
    var node = document;
    var tag = 'div';
    var els = node.getElementsByTagName(tag);
    var elsLen = els.length;
    var pattern = new RegExp("(^|\\s)"+searchClass+"(\\s|$)");
    for (i = 0, j = 0; i < elsLen; i++) {
        if ( pattern.test(els[i].className) ) {
            classElements[j] = els[i];
            j++;
        }
    }
    return classElements;
}  

function getDivs(){
var divArry = getElementsByClass('editable')
var postElmnts = '';
    for(i=0; i<divArry.length; i++){
        pageName = divArry[i].id;
        pageContent = document.getElementById(pageName).innerHTML;
        //alert(pageName + ': ' + pageContent);//Test if divs are identified properley
        postElmnts= postElmnts + pageName + ': ' + pageContent + ', ';
    };
    postElmnts = postElmnts.slice(0, -2);
    postArry = '{' + postElmnts + '}';
    $.post("process_jQuery_test.php",postArry, function(data){alert(data + 'Original: ' +  postArry);});

}

function grabText(){
    var one = document.getElementById( 'block1' ).innerHTML;
    var two = document.getElementById( 'block2' ).innerHTML;
    var three = document.getElementById( 'block3' ).innerHTML;
    $.post("process_jQuery_test.php", { block1: one, block2: two, block3: three}, function(data){alert( data );} );

}

</script>
</head>

<body>
    <button onClick="getDivs();">Get Divs dynamically</button>
    <button onClick="grabText();">Grab Text to hard coded index</button>


    <div id="block1" class="editable"><p>This is Block 1 content</p></div>
    <div id="block2" class="editable"><p>This is Block 2 content</p></div>
    <div id="block3" class="editable"><p>This is Block 3 content</p></div>
</body>
</html>

这是PHP测试处理程序:

<?php
$data = json_decode($_POST, true);
$decode = json_decode($_POST,true);
$decodeNstrip = json_decode(stripslashes($_POST),true);

echo "Post 0: ".$_POST[0]."\n\r";

echo "\n\rPost block1: ".$_POST['block1']."\n\r";

echo "\n\rPost loop\n\r";
foreach($_POST as $key => $value){
    echo $key.': ' .$value."\n\r";
} 

echo "\n\rPost decode: ";
print_r($decode)."\n\r";

echo "\n\rPost decode and strip: ";
print_r($decodeNstrip)."\n\r";

echo "\n\rPost Array: ";
print_r($_POST)."\n\r";

?>

2 个答案:

答案 0 :(得分:3)

传递给.post的数据只接受 String Object

String 与查询字符串一样,例如year=2000&month=11

键值/配对中的

Object ,例如{"year":2000,"month":11}

答案 1 :(得分:1)

在grabText中你传递一个数组/对象但是在getDivs中你正在尝试发送文本。文本可以格式化为query string,但我更喜欢这种方法。

function getDivs(){
var divArry = getElementsByClass('editable')
var postElmnts = '';
var msg = {}
    for(i=0; i<divArry.length; i++){
        pageName = divArry[i].id;
        pageContent = document.getElementById(pageName).innerHTML;
        msg[pageName] = pageContent
    };
    $.post("handle.php",msg, function(data){alert(data);});
}

这是jQuery的做法。我仍然更喜欢更传统的方法(加上它更快一点)。

function getDivs(){
    var msg = {}
    $('.editable').each(function(e){
            msg[$(this).attr('id')] = $(this).html();
    });

    $.post("handle.php",msg, function(data){alert(data);});
}