Home > Web Front-end > JS Tutorial > 如何利用jQuery ajax post传递含特殊字符的数据

如何利用jQuery ajax post传递含特殊字符的数据

WBOY
Release: 2016-06-01 09:54:10
Original
895 people have browsed it

在jQuery中,我们通常利用$.ajax或$.post进行数据传递处理,但这里通常不能传递特殊字符,如:“

1、准备页面和控制端代码

页面代码如下:

<code class="language-html"><script type="text/javascript">
  $(function() {
      $("#btnSet").click(function() {
        var a = $("#txtValue").val();
        var data = { Name: a };
        alert(data);
        $.ajax({
          url: '@Url.Action("MyTest")',
          type: 'post',
          dataType: 'json',
          data: data,
        });
      });
    }
  );
</script>
<h2>Index</h2>
<input type="text" id="txtValue"><input type="button" value="设置" id="btnSet">
</code>
Copy after login

后台代码如下:

<code class="language-java">public ActionResult MyTest(StudentInfo stu)
{
    return Content("OK");
}</code>
Copy after login

其中StudentInfo定义如下:

<code class="language-java">public class StudentInfo
{
  public string Name { get; set; }
}</code>
Copy after login

 

2、测试数据传递

当我们传递普通数据时,一切正常。

但当输入含特殊字符的数据时,不能正常传递到后台。

 

3、处理方法

如果确定要传递特殊字符,需要对jQuery代码作调整,调整后的请求代码如下:

<code class="language-html"><script type="text/javascript">
  $(function() {
      $("#btnSet").click(function() {
        var a = $("#txtValue").val();
        var data = JSON.stringify({ Name: a });
        alert(data);
        $.ajax({
          url: '@Url.Action("MyTest")',
          type: 'post',
          dataType: 'json',
          data: data,
          contentType: 'application/json'
        });
      });
    }
  );
</script></code>
Copy after login

调整的地方主要有两点:

对要传递的json数据作序列化JSON.stringify
在$.ajax请求中新增参数:contentType:'application/json'

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template