最近需要做一个通过第三方系统url返回的json内容，展示位门户首页新闻图片轮播的控件，整理代码如下，备查
import net.sf.json.JSONObject;
import net.sf.json.JsonConfig;
import net.sf.json.util.JSONTokener;
//省略
@ResponseBody
@RequestMapping(params = "method=initpic")
public String initpic(HttpServletRequest request, HttpServletResponse response) {
final String NULL_IMAGE_PATH = "http://www.baidu.com/img/bd_logo1.png";
String result="";
StringBuffer html = new StringBuffer();
BufferedReader reader = null;
try{
String orgurl = request.getParameter("url");
URL connect = new URL(orgurl.toString());
URLConnection connection = connect.openConnection();
connection.connect();
reader = new BufferedReader(new InputStreamReader(connection.getInputStream(),"UTF-8"));
String line;//循环读取
while ((line = reader.readLine()) != null) {
result += line;
}
if(!result.equals("")){
JsonConfig jsonConfig = new JsonConfig();
Map<String, Class> classMap = new HashMap<String, Class>();
classMap.put("result", String.class);
classMap.put("Page", Integer.class);
classMap.put("Pages", Integer.class);
classMap.put("Total", Integer.class);
classMap.put("Pagesize", Integer.class);
classMap.put("Items", HashMap.class);
jsonConfig.setClassMap(classMap);
jsonConfig.setRootClass(HashMap.class);
JSONTokener jt = new JSONTokener(result);
Object obj = jt.nextValue(jsonConfig);
JSONObject ja = JSONObject.fromObject(obj);
Map<String, List<Map>> map = (Map<String, List<Map>>) JSONObject.toBean(ja, jsonConfig);
List itemlist = map.get("Items");
html.append("<div style=\"width:500px;margin:0px auto;\">")
.append("<div class=\"roll-news-keleyi-com\">").append("<div class=\"roll-news-image\">");
for (int i = 0; i < itemlist.size(); i++) {
Map<String,Object> imgmap = (Map<String, Object>) itemlist.get(i);
html.append("<img src=\"");
if(imgmap.get("thumb")!=null && !"".equals(imgmap.get("thumb").toString())){
html.append(imgmap.get("thumb"));
}else{
html.append(NULL_IMAGE_PATH);
}
if(i!=0){
html.append("\" style=\"display:none\" >");
}else{
html.append("\">");
}
}
html.append("</div>");
html.append("<div class=\"roll-news-index\">");
html.append("<ul>");
for (int i = 0; i < itemlist.size(); i++) {
html.append("<li");
if(i == 0){
html.append(" class=\"roll-news-index-hover\"");
}
html.append(">").append(i+1).append("</li>");
}
html.append("</ul>");
html.append("</div>");
html.append("<div class=\"roll-news-title\">");
for (int i = 0; i < itemlist.size(); i++) {
Map<String,Object> imgmap = (Map<String, Object>) itemlist.get(i);
html.append("<a href=\"").append(imgmap.get("thumb"));
html.append("\" ");
if(i!=0){
html.append("style=\"display:none\"");
}
html.append(" >");
html.append(imgmap.get("title"));
html.append("</a>");
}
html.append("</div></div></div>");
System.out.println(html.toString());
}
}catch(Exception e){
e.printStackTrace();
}finally{
if(reader!=null){//关闭流
try {
reader.close();
} catch (IOException e) {
e.printStackTrace();
}
}
}
return html.toString();
}
页面
<%@page import="java.util.ListResourceBundle"%>
<%@page import="java.util.List"%>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<HEAD>
<TITLE> </TITLE>
<META content="text/html; charset=utf-8" http-equiv=Content-Type>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script src="res/js/json2.js" type="text/javascript" charset="UTF-8"></script>
<script src="res/js/jquery-1.8.0.min.js" type="text/javascript" charset="UTF-8"></script>
<style type="text/css">
* {
padding:0px;
margin:0px;
}
.roll-news-keleyi-com {
width:480px;
height:300px;
border:solid 1px #c1c1c1;
}
.roll-news-index-hover {
background-color:white;
}
.roll-news-image img {
width:480px;
height:300px;
}
.roll-news-index {
position:relative;
top:-50px;
margin-right:5px;
float:right;
}
.roll-news-index {
}
.roll-news-index li {
list-style:none;
float:left;
font-size:12px;
font-weight:600;
width:18px;
height:16px;
line-height:16px;
cursor:pointer;
margin:0 3px;
background-image:url(opacity_50.png);
text-align:center;
}
.roll-news-title {
position:relative;
top:-25px;
padding-left:10px;
height:22px;
line-height:20px;
background:url(opacity_50.png);
}
.roll-news-title a {
font-size:12px;
text-decoration:none;
color:white;
background-color:gray
}
.roll-news-title a:hover {
color:red;
}
</style>
</HEAD>
<body>
<div id="imgdiv">
</div>
</body>
<script type="text/javascript">
$(document).ready(function () {
$.ajax({
type : "post",
url : "login.go?method=initpic&url=http://www.xinhuamed.com.cn/getnews.aspx?action=list&page=1&pagesize=10",
contentType : "application/text; charset=utf-8",
success : function(data) {
document.getElementById("imgdiv").innerHTML=data;
},
error : function(msg) {
}
});
setTimeout(function(){
var index = 0;
var slideFlag = true;
var length = $(".roll-news-image img").length;
function showImg(i) {
$(".roll-news-image img")
.eq(i).stop(true, true).fadeIn(800)
.siblings("img").hide();
$(".roll-news-index li").removeClass("roll-news-index-hover");
$(".roll-news-index li").eq(i).addClass("roll-news-index-hover");
$(".roll-news-title a")
.eq(i).stop(true, true).fadeIn(800)
.siblings("a").hide();
}
showImg(index);
$(".roll-news-index li").click(function () {
index = $(".roll-news-index li").index(this);
showImg(index);
slideFlag = false;
});
function autoSlide() {
setInterval(function () {
if (slideFlag) {
showImg((index + 1) % length);
index = (index + 1) % length;
}
slideFlag = true;
}, 3000);
}
autoSlide();
},500);
});
</script>
</html>
分享到：
相关推荐
在这个项目中，你需要替换原有的数据源URL，实现向新的API接口发送请求，获取新闻数据。 3. **解析类**：数据获取后，需要进行解析，转换为应用程序可理解的格式。JSON是常见的数据交换格式，可以使用系统的`...
解析JSON通常需要使用`org.json`库或Gson库，将接收到的字符串转换为Java对象，然后提取出图片链接。 对于网络请求和图片加载，这个项目可能使用了如`HttpURLConnection`、`OkHttp`或者`Volley`等网络库来获取图片...
- JSON解析：使用Json.NET库，可以方便地将JSON字符串转换为C#对象。解析后的数据可以直接绑定到窗体控件上。 - XML解析：如果返回的是XML，可以使用System.Xml命名空间的类，如XmlDocument或XDocument进行解析。 ...
-为容器控件（比如Panel,Region,Tab等）增加AJAX属性IFrameUrl(feedback:BluesT)。 -重新设计模拟树的下拉列表的实现，避免选中某项后的闪烁。 +2009-11-21 v2.1.5 +Tree优化。 -修正Expanded项和Checked...
-为容器控件（比如Panel,Region,Tab等）增加AJAX属性IFrameUrl(feedback:BluesT)。 -重新设计模拟树的下拉列表的实现，避免选中某项后的闪烁。 +2009-11-21 v2.1.5 +Tree优化。 -修正Expanded项和Checked...
超实用的jQuery代码段精选近350个jQuery代码段，涵盖页面开发中绝大多数要点、技巧与方法，堪称史上最实用的jQuery代码参考书，可以视为网页设计与网站建设人员的好帮手。《超实用的jQuery代码段》的代码跨平台、跨...
然后，通过JSON解析库如Gson或Jackson将数据转换为Java对象。展示时，源码会根据漫画的分页结构，调整图片大小以适应屏幕，并支持横竖屏切换。 四、手势操作与动画 为了让用户更好地交互，源码可能实现了手势识别...
然后，根据当前地图的缩放级别和瓦片坐标系统，转换这个像素坐标为经纬度坐标。这些坐标可以显示在Qt界面的其他控件中。 步骤8：优化性能 由于离线地图的数据量可能非常大，为了提高性能，可以采用缓存策略，将最近...
- **请求构建**: 使用`requestWithPath:parameters:`方法构建请求，之后将请求转换为JSON格式的Operation并加入队列执行，设置回调处理成功或失败的情况。 - **参数传递**: 参数通过字典形式传递，利用`...
设定字符串为“张三，你好，我是李四” 产生张三的密钥对(keyPairZhang) 张三生成公钥(publicKeyZhang)并发送给李四,这里发送的是公钥的数组字节 通过网络或磁盘等方式,把公钥编码传送给李四，李四接收到张三编码后...
`package-lock.json`和`package.json`是npm管理依赖的文件，`.gitignore`定义了Git忽略的文件或目录，`babel.config.js`是Babel的配置文件，用于转换ES6+语法到浏览器可识别的版本，`README.md`则是项目说明文档。...
6. **JSON序列化与反序列化**：Swift的标准库提供了`JSONDecoder`和`JSONEncoder`，用于将JSON数据转换为Swift对象和反之。这对于从服务器获取和发送卡片数据非常有用。 7. **动画效果**：为了提升用户体验，卡管理...
- 文件编辑器，文件树目录 上下左右键盘切换 快捷键加入 - 树目录去掉库,改为个人目录等多处文案修改 - 默认打开用户目录 ####fix bug:（bug解决和程序优化） - 桌面任务栏点不中bug - 部分文案问题 - 众多...
- **布局设计**：使用LinearLayout或ConstraintLayout等布局控件来划分聊天界面为左右两部分。 - **视图重用**：为了提高性能，可以使用ViewHolder模式来重用已加载的视图元素，避免频繁地创建和销毁视图。 - **错位...