用json发送outerhtml会带来麻烦

时间:2019-03-27 08:04:37

标签: javascript php jquery

我想通过ajax调用发送html源代码的某些部分。

如果我以这种方式定义要发送给ajax调用的数据:

var content={};


content['mypart1']='my content 1';
content['mypart2']='my content 2';
content=JSON.stringify(content);

在控制台中,我看到以下要发送的字符串:

... , content: "{\"mypart1\":\"my content 1\",\"mypart2\":\"my content 2\"}" ...

有效。在$test=json_decode($post['content']);之后,我有了想要的内容部分数组。

现在我需要将其与实际内容一起使用,所以我尝试了这一点;

$("[myselector]").each(function(i, part) {
content['mypart1']=$(part)[0].outerHTML;
content['mypart2']=$(part)[0].outerHTML;
});
content=JSON.stringify(content);

现在我在控制台中看到所需的html代码正确位于字符串中。

但是,如果我发送此消息,我会在控制台中看到字符串内有多个///符号,并且键现在也位于\“内。 "{\"mypart1\":\"<div id=\\\"myid\\\" data-mydataid=\\\"123456\\\" class=\\\".....

我认为是因为此错误字符串导致jason_decode无法正常工作。

$test=json_decode($post['content']);

有了这些数据,我将不会收到所需的数组,$ test为空。

是什么原因导致多个///-符号和/-周围的按键以及如何防止这种情况?

非常感谢您的帮助和解释。

在将它们添加到字符串化字符串之前,也许我必须先对externalhtml部分进行反序列化?

这是Ajax调用

do_ajax_call({   
'content': content,
...
 });

function do_ajax_call(data,ajaxurl){ 
....
$.ajax({    url: ajaxurl,
            method: 'POST',
            data: data,
            dataType:'json',            
            success: function(result){
    ...
});

1 个答案:

答案 0 :(得分:1)

HTML:

<div class="progress-bar progress-primary" id="bar" role="progressbar" style="width: 0%"></div>
<b id="import"></b>

js:

var data = {};//js object
data["key1"] = document.getElementById('import').outerHTML;
data["key2"] = document.getElementById('bar').outerHTML;

        $.ajax({
            beforeSend: function () {
            },
            complete: function () {
            },
            type: "POST",
            url: ajaxurl,
            data: data,
            success: function (data) {
                setTimeout(function () {
                }, 1000);
            }
        });

php:

echo'<pre>';print_r($_POST);die;

输出:

<pre>Array
(
    [key1] => <b id="import"></b>
    [key2] => <div class="progress-bar progress-primary" id="bar" role="progressbar" style="width: 0%"></div>
)

这是经过测试的代码