需求是a服务器下页面b.jsp需要调用b服务器的action CoureseInfoProvideAction.java，用了JQuery+ajax技术，返回json类型的数据：
b.jsp:
<script type="text/javascript">
function showCourseInfo(){
var resourceCode = document.getElementById("resourceCode").value;
jQuery.getJSON("http://10.10.6.31:8099/coureseInfoProvide.jhtml?courseNumber="+resourceCode, function(data) {
if(data!="0"){
document.getElementById('resourceName').value = data.courseName;
document.getElementById('languageType').value = data.lang;
}else{
alert("课件编码不存在!!!");
}
});
}
</script>
<body>
<dt>
<label><span>*</span> 课件名称：</label>
</dt>
<dd>
<input type="text" class="default_txt" id="resourceName" name="resourceName"/>
</dd>
<dt>
<label><span>*</span> 课件编码：</label>
</dt>
<dd>
<input type="text" class="default_txt" id="resourceCode" name="resourceCode" value="112290_eng"/>
<input name="Button2" type="button" class="btn btn_default" onclick="showCourseInfo()" value="Load…" />
</dd>
<dt>
<label>语言属性：</label>
</dt>
<dd>
<select id="languageType" name="languageType" class="mini_sel">
<option>-请选择-</option>
<option value="1">中文</option>
<option value="0">英文</option>
<option value="-1">其他</option>
</select>
<input type="text" class="default_txt" id="languageNote" name="languageNote"/>
</dd>
</body>
CoureseInfoProvideAction.java:
public String process() throws Exception {
response.setContentType("text/xml;charset=UTF-8");
response.setHeader("Cache-Control", "no-cache");
response.addHeader("Access-Control-Allow-Origin", "*");
response.addHeader("Access-Control-Allow-Headers", "x-requested-with");
PrintWriter out = response.getWriter();
if(StringUtil.isBlank(courseNumber)){
Course course = courseService.getValidCourse(courseNumber);
if(course!=null){
StringBuilder sb = new StringBuilder();
String courseName = course.getCourseName();
sb.append("{");
sb.append("\"");
sb.append("courseName");
sb.append("\"");
sb.append(":");
sb.append("\"");
sb.append(courseName);
sb.append("\"");
Integer lang = course.getLang();
sb.append(",");
sb.append("\"");
sb.append("lang");
sb.append("\"");
sb.append(":");
sb.append("\"");
sb.append(lang);
sb.append("\"");
sb.append("}");
out.print(sb.toString());
course = null;
}else{
out.print("0");
}
}
return null;
}
在CoureseInfoProvideAction.java中增加了response对header的处理，用于对跨域提交参数的支持，在StringBuilder中把字符串组装成了json的格式，在页面便于解析、接收参数。
分享到：
相关推荐
JQuery AJAX 跨域提交参数、接收 JSON 数据 JQuery 的 AJAX 功能是实现异步数据交互的核心部分，对于跨域提交参数和接收 JSON 数据的需求，JQuery 提供了多种解决方案。 首先，JQuery 的 AJAX 功能可以使用 `$....
本篇文章将详细讲解如何利用jQuery的jsonp方法实现Ajax跨域请求，以及如何在服务器端使用.Net的*.handler和WebService来返回JSON数据。 首先，理解JSONP的基本原理。JSONP是一种非官方的协议，通过动态创建`...
$.ajax()可以接受一系列参数，其中关键的两个是`url`（指定要请求的远程服务地址）和`dataType`（指定返回数据的类型，如json、xml等）。为了实现跨域，我们需要设置`dataType`为`jsonp`。JSONP（JSON with Padding...
本示例主要展示了如何使用jQuery的Ajax功能解决HTML与PHP之间的跨域问题，结合JSON进行数据交换。让我们详细了解一下这个过程。 首先，我们要理解什么是跨域。在浏览器的安全策略中，由于同源策略的限制，一个域名...
这里的"Ajax + jQuery跨域获取JSON"是一个典型的Web开发技术应用场景，主要用于解决Web应用程序中不同源之间的数据共享问题。在本案例中，开发者成功地实现了跨域请求以获取JSON数据，并将这些数据用于展示天气预报...
另外，如果你的JSON数据是在本地文件系统中，如在压缩包中的'jquery 回调函数成功代码'文件，你可能需要使用file协议来访问，但这通常只在开发环境中可行，因为浏览器的安全策略通常不允许跨域请求本地文件。...
**Ajax跨域请求问题与jQuery JSONP解析** 在Web开发中，Ajax技术被广泛用于实现页面的异步更新，但浏览器的同源策略（Same-Origin Policy）限制了Ajax请求只能向同源（协议、域名、端口均相同）的服务器发送。这在...
ajax跨域实例 Ajax 跨域操作是指在不同的域名、协议或端口之间进行 Ajax 请求的操作。由于浏览器的同源策略限制，跨域操作需要在前端和服务端指定共同规则，以便实现安全的数据交换。在本文中，我们将讨论两个 ...
本教程将深入探讨如何使用jQuery通过Ajax处理JSON格式的数据。JSON（JavaScript Object Notation）是一种轻量级的数据交换格式，易于人阅读和编写，同时也易于机器解析和生成，是Web服务和客户端之间交换数据的常用...
jQuery 提供了一个非常方便的解决方案，尤其是从1.2版本开始，它引入了`$.getJSON()`方法，这个方法支持JSONP（JSON with Padding）协议，从而实现跨域数据获取。JSONP是一种绕过同源策略的技术，它通过动态插入`...
本文主要介绍两种在使用jQuery进行跨域获取json数据时的实现方法，即通过jQuery的ajax和getJson方法配合JSONP（JSON with Padding）技术来实现跨域数据的获取。 首先，关于jQuery的ajax和getJson方法。ajax是...
实现jquery ajax跨域。前台页面 和 java代码类
对于jQuery的跨域请求，可以使用`$.ajax`或`$.getJSON`等方法，并设置`crossDomain`参数为`true`： ```javascript $.ajax({ url: 'http://api.example.com/data', type: 'GET', crossDomain: true, success: ...
本篇文章将深入探讨如何使用jQuery的`$.ajax`方法来实现异步请求并接收JSON数据。 首先，JSON（JavaScript Object Notation）是一种轻量级的数据交换格式，它允许服务器以易于解析的方式发送数据到客户端。在jQuery...
标题 "jquery跨域获取json" 涉及到的是JavaScript中的一个常见问题，即如何在浏览器环境中使用jQuery库跨越域限制获取JSON数据。这通常涉及到AJAX请求和JSONP（JSON with Padding）技术。 首先，我们需要理解Web...
本文将深入探讨如何使用jQuery的ajax方法来提交表单，从而实现异步数据交换，提高用户体验。 首先，jQuery的$.ajax()函数是进行Ajax请求的核心，它允许我们与服务器进行异步数据通信。在“使用jQuery ajax提交表单...
### Jquery跨域Json请求处理详解 #### 一、跨域问题概述 在现代Web开发中，跨域问题是一个常见的技术挑战。简单来说，当一个网页尝试从不同的源（源可以理解为协议、域名或者端口号）加载资源时，就会遇到跨域限制...
此外，jQuery还提供了`.getJSON()`方法，它是`.ajax()`的一个简化的版本，专门用于获取JSON数据： ```javascript $.getJSON('path_to_your_json_file.json', function(data) { console.log(data); // 处理JSON...
本篇文章主要分享了如何使用jQuery的ajax方法请求本地的JSON文件，并在前端页面上展示数据的过程。以下是从文章中提取的详细知识点： 1. jQuery的ajax方法： jQuery是一个快速、小巧、功能丰富的JavaScript库，其...