jQuery AJAX 正在从 HTML 数据中剥离内联 CSS

Question

我正在尝试通过 AJAX 将 HTML 数据传递到服务器。我最终想将完整的 HTML 代码(包括任何内联 CSS 定义)存储在数据库中。我不想对 HTML 数据进行任何更改，只是按原样存储它。我的问题是，当我通过 AJAX 传递 HTML 数据时，当它到达服务器时，内联 CSS 已被删除，但不仅如此，它被错误地删除，留下无效的 HTML。

这是我正在尝试做的示例:

var the_html = {'html':'<p><span style="font-size:42px;"><span style="color:#f00;">
    Some text</span></span></p>'};

$.ajax({
    type: 'POST',
    url: 'ajax.php',
    data: the_html,
    success: function (data) {
        alert(data);
    }
});

当数据到达服务器时，它看起来像这样:

<p><span>span style="color:#f00;">Some Text</span></span></p>

在我看来，jQuery 试图去除所有内联 CSS，但由于还删除了第二个 span 标签的左尖括号，所以搞砸了第一个 span 标签。我尝试在通过 AJAX 发送数据之前转义数据，但结果是一样的。此外，我使用对象字面量语法是因为我要传递的数据比示例中多得多，而且我希望它在到达服务器时成为一个关联数组。

我根本不想删除内联 CSS。我希望所有的标记加上任何 CSS 原封不动地发送到服务器。关于如何实现此目标的任何想法？

Answer 1

在 javascript/前端用 style1(或任何东西)替换样式 再次在服务器端将其从 style1 替换回 style

例子:

$.ajax({ url:base_url+'/adminevent/dragDrop', data:{pid:p_id,content:data.replace('style','style1'),update:'update'}, type:'POST', success:function(res){ //alert(res) } });

在服务器端(对我来说是 PHP):

str_replace('style1','style',$content)