Javascript 如何使用ajax(MVC)传递html内容

Javascript 如何使用ajax(MVC)传递html内容,javascript,c#,jquery,ajax,asp.net-mvc-4,Javascript,C#,Jquery,Ajax,Asp.net Mvc 4,我需要从特定表单获取HTML,并将其保存在项目中的HTML文件中 因此,我有一个builderajax函数,它将这个HTML发送到服务器,然后保存它 我在向服务器发送HTML时遇到问题,如果我发送字符串Hello word,所有操作都正常,但使用Hello则无法正常工作 使用ajax发送HTML内容的正确方法是什么 我知道[ValidateInputfalse],但它不起作用 这是我的控制器: [HttpGet] [ValidateInput(false)] public void Upd

我需要从特定表单获取HTML,并将其保存在项目中的HTML文件中

因此,我有一个builderajax函数,它将这个HTML发送到服务器,然后保存它

我在向服务器发送HTML时遇到问题,如果我发送字符串Hello word,所有操作都正常,但使用Hello

则无法正常工作

使用ajax发送HTML内容的正确方法是什么

我知道[ValidateInputfalse],但它不起作用

这是我的控制器:

 [HttpGet]
 [ValidateInput(false)]
 public void UpdateHtml(string html)
     {
        try
         {
             string path1 = @"D:\test\my.html";
             System.IO.File.WriteAllText(path1, html);

                }
                catch (Exception ex)
                {
                }

            }
这是我的ajax:

function btn_Upload_Click() {

    var html = tinyMCE.activeEditor.getContent();//my html
  //var html = "Hello"//Like this all working
    var token = $('input[name="__RequestVerificationToken"]').val();//checked:OK
    var funcUrl = $("#btn_saveHtml").data("urlaction");//checked :OK
    $.ajax({
        url: funcUrl,
        type: 'GET',
        dataType : "text/xml",
        data: {
            html:html,
            __RequestVerificationToken: token
        },

        success: function (data)
        {
            alert("Good");
        },
        error: function (xhr, status, error) {

            alert(xhr.responseText);
            alert(xhr.status);
            alert(error);
        }
    });

}
Update2:我正在尝试发送的html:

\n欢迎来到TinyMCE编辑器演示\n\n图像工具插件功能单击图像开始\n请尝试此图像工具示例中提供的功能。

\n请注意,此示例中的任何MoxieManager文件和图像管理功能都是我们商业产品的一部分–演示旨在展示集成。

\n是否有问题或需要帮助?\n\n对于学习如何配置TinyMCE,nOur是一个很好的资源。\n有一个具体的问题吗?请访问。\n我们还提供企业级支持作为其一部分。\n\n可使用的简单表格\n\n\n\n产品\n成本\n实际?\n\n\n\n\n免费\nYES\n\n\n上传\n免费\n是\n\n\n\n找到一个bug?\n如果您认为您发现了bug,请在上创建一个问题并报告给开发人员。

\n最后…\n不要忘记查看我们的其他产品,这是您的最终上传解决方案,具有HTML5上传支持。

\n感谢您对TinyMCE的支持!我们希望它能帮助您和您的用户创建精彩的内容。TinyMCE团队将为您提供最好的服务。


我的ajax返回空错误,因此无法获取更多信息。

您需要使用该函数

    html:encodeURIComponent(html);

请参见

您需要使用该功能

    html:encodeURIComponent(html);

请参见

您可以通过多种方式执行此操作:-

将内容字符串化为JSON

stringify{'html':html}

将HTML字符串放在单引号中

通过添加\,从HTML代码中转义双引号

使用 数据传递时使用:Encoder.htmlDecodevalue


此外,在JSON中传递HTML时,请记住4件事。

您可以通过多种方式执行此操作:-

将内容字符串化为JSON

stringify{'html':html}

将HTML字符串放在单引号中

通过添加\,从HTML代码中转义双引号

使用 数据传递时使用:Encoder.htmlDecodevalue

另外,在JSON中传递HTML时,请记住4件事。

这是ajax请求

$.ajax({
        url: '@Url.Action("Test")',
        type: 'POST',
        datatype: 'text/xml',
        data: { "html": "<p style=\"text-align: center; font-size: 15px;\"><img title=\"TinyMCE Logo\" src=\"//www.tinymce.com/images/glyph-tinymce@2x.png\" alt=\"TinyMCE Logo\" width=\"110\" height=\"97\" /></p>\n<h1 style=\"text-align: center;\">Welcome to the TinyMCE editor demo!</h1>\n<h1><img style=\"float: right; padding: 0 0 10px 10px;\" title=\"Tiny Husky\" src=\"//www.tinymce.com/docs/images/tiny-husky.jpg\" alt=\"Tiny Husky\" width=\"304\" height=\"320\" /></h1>\n<h2>Image Tools Plugin feature<br />Click on the image to get started</h2>\n<p>Please try out the features provided in this image tools example.</p>\n<p>Note that any <strong>MoxieManager</strong> file and image management functionality in this example is part of our commercial offering &ndash; the demo is to show the integration.</p>\n<h2>Got questions or need help?</h2>\n<ul>\n<li>Our <a href=\"https://www.tinymce.com/docs/\">documentation</a> is a great resource for learning how to configure TinyMCE.</li>\n<li>Have a specific question? Visit the <a href=\"http://community.tinymce.com/forum/\">Community Forum</a>.</li>\n<li>We also offer enterprise grade support as part of <a href=\"www.tinymce.com/pricing\">TinyMCE Enterprise</a>.</li>\n</ul>\n<h2>A simple table to play with</h2>\n<table>\n<thead>\n<tr>\n<th>Product</th>\n<th>Cost</th>\n<th>Really?</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>TinyMCE</td>\n<td>Free</td>\n<td>YES!</td>\n</tr>\n<tr>\n<td>Plupload</td>\n<td>Free</td>\n<td>YES!</td>\n</tr>\n</tbody>\n</table>\n<h2>Found a bug?</h2>\n<p>If you think you have found a bug please create an issue on the <a href=\"https://github.com/tinymce/tinymce/issues\">GitHub repo</a> to report it to the developers.</p>\n<h2>Finally ...</h2>\n<p>Don't forget to check out our other product <a href=\"http://www.plupload.com\" target=\"_blank\">Plupload</a>, your ultimate upload solution featuring HTML5 upload support.</p>\n<p>Thanks for supporting TinyMCE! We hope it helps you and your users create great content.<br />All the best from the TinyMCE team.</p>" },
        error: function () {
            console.log("error");
        },
        success: function () {

        }
    })
当然我没有任何令牌。我可以在调试模式下从服务器捕获html。

这是ajax请求

$.ajax({
        url: '@Url.Action("Test")',
        type: 'POST',
        datatype: 'text/xml',
        data: { "html": "<p style=\"text-align: center; font-size: 15px;\"><img title=\"TinyMCE Logo\" src=\"//www.tinymce.com/images/glyph-tinymce@2x.png\" alt=\"TinyMCE Logo\" width=\"110\" height=\"97\" /></p>\n<h1 style=\"text-align: center;\">Welcome to the TinyMCE editor demo!</h1>\n<h1><img style=\"float: right; padding: 0 0 10px 10px;\" title=\"Tiny Husky\" src=\"//www.tinymce.com/docs/images/tiny-husky.jpg\" alt=\"Tiny Husky\" width=\"304\" height=\"320\" /></h1>\n<h2>Image Tools Plugin feature<br />Click on the image to get started</h2>\n<p>Please try out the features provided in this image tools example.</p>\n<p>Note that any <strong>MoxieManager</strong> file and image management functionality in this example is part of our commercial offering &ndash; the demo is to show the integration.</p>\n<h2>Got questions or need help?</h2>\n<ul>\n<li>Our <a href=\"https://www.tinymce.com/docs/\">documentation</a> is a great resource for learning how to configure TinyMCE.</li>\n<li>Have a specific question? Visit the <a href=\"http://community.tinymce.com/forum/\">Community Forum</a>.</li>\n<li>We also offer enterprise grade support as part of <a href=\"www.tinymce.com/pricing\">TinyMCE Enterprise</a>.</li>\n</ul>\n<h2>A simple table to play with</h2>\n<table>\n<thead>\n<tr>\n<th>Product</th>\n<th>Cost</th>\n<th>Really?</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>TinyMCE</td>\n<td>Free</td>\n<td>YES!</td>\n</tr>\n<tr>\n<td>Plupload</td>\n<td>Free</td>\n<td>YES!</td>\n</tr>\n</tbody>\n</table>\n<h2>Found a bug?</h2>\n<p>If you think you have found a bug please create an issue on the <a href=\"https://github.com/tinymce/tinymce/issues\">GitHub repo</a> to report it to the developers.</p>\n<h2>Finally ...</h2>\n<p>Don't forget to check out our other product <a href=\"http://www.plupload.com\" target=\"_blank\">Plupload</a>, your ultimate upload solution featuring HTML5 upload support.</p>\n<p>Thanks for supporting TinyMCE! We hope it helps you and your users create great content.<br />All the best from the TinyMCE team.</p>" },
        error: function () {
            console.log("error");
        },
        success: function () {

        }
    })


当然我没有任何标记。我可以在调试模式下从服务器捕获html。

这是JSON.stringify{'html':html};不是JSON.stringify{'html':html}小写?任何小写的方式都不起作用。您可以共享从tinyMCE.activeEditor.getContentI获得的html字符串吗?我使用了var jsonString=JSON.stringifystrHtml,我已经更新了我的html,你可以在qustion中看到它,但它仍然不起作用;不是JSON.stringify{'html':html}小写?任何小写的方式都不起作用。您可以共享从tinyMCE.activeEditor.getContentI获得的html字符串吗?我使用了var jsonString=JSON.stringifystrHtml,我已经更新了我的html,你可以在qustion中看到它,但它仍然不起作用。\u RequestVerificationToken可能会导致这种情况。你在另一个请求中这样使用它了吗?我的意思是发送作为数据的令牌不在请求的头中你是否尝试了这个没有令牌的请求?是的,我尝试过,就像我在问题中写的那样,如果我发送Hello World all works,问题是我试图发送的html,抱歉我错过了它。我试过了,我无法解释为什么只发送“Hello

”时不工作,因为它对我的项目有效。但是对于你的html它不工作,然后我用POST request试过了,但没有用你的html。你用POST request试过吗?你能在这里发布你的javascript和服务器端代码吗?也许我缺少一些你认为小的请求验证会导致这种情况。你在另一个请求中也这样使用过吗?我的意思是发送作为数据的令牌不在请求的头中你是否尝试了这个没有令牌的请求?是的,我尝试过,就像我在问题中写的那样,如果我发送Hello World all works,问题是我试图发送的html,抱歉我错过了它。我试过了,我无法解释为什么只发送“Hello

”时不工作,因为它对我的项目有效。但是对于你的html它不工作,然后我用POST request试过了,但没有用你的html。你用POST request试过吗?你能在这里发布你的javascript和服务器端代码吗?也许我缺少一些想想smallI,我从get改为post,所有的功能都可以使用,但我仍然不明白为什么使用data=Hello可以使用data
你好

不是!?!?!?!我甚至不想把内容字符串化为JSON……我真的很困惑……我在这个问题上花了太多时间,我也很困惑:因为你的控制器是一个帖子,但你试图请求它,而GETI从get改为POST,所有的工作都在进行中,但我仍然不明白为什么使用data=Hello有效,而使用dataHello

无效!?!?!?!我甚至不想把内容字符串化为JSON……我真的很困惑……我在这个问题上花了太多时间,我也很困惑:因为你的控制器是一个帖子,但你试图用GET请求它