最近遇到的一些问题的解决方案,主要是关于jQuery和前台传数据,判断,刷新页面等。
1. 拼接
2.用Location传值
3.显示的前后关系 z-index
4.关于jQuery 事件 - ready() 方法
5.表单提交绑定回车键的问题
6.汉字传值的解码
7.ajax
8.struts2下两种action往前台传值的方法
9.sweetalert
- 拼接
在写智能提示的时候用到了拼接技术
推荐外层用单引号 ’ ‘,
在引号内的是常字符串,外面的是变量
这是把html在一起显示出来的代码
for(var i=0;i<d.length;i++){
html+= '<li>'+d[i].searchText+'</li>' ;
}
这是轮播图的每次单独显示
success:function(data){
$("#carousel-animate").empty();
for(var i=0;i<data.length;i++){
var pi=data[i];
var html="<div class='item "+(i==0?'active':'')+" height-control'><a href='#'><img src='" + pi['pictureName'] + "' alt='First slide'></a><div class='carousel-caption'>描述</div></div>";
$("#carousel-animate").append(html);
$("#carousel-animate").fadeIn('show');
}
}
2.用Location传值
用下列方法可以用jQuery轻松把?后面的数据传到另一个页面
传值页面
$("#searchBtn").click(function(){
var keyWord=$('#searchInput').val();
$.ajax({
url:'${pageContext.request.contextPath}/bid/reAction_querySearchResult.action',
type:'POST',
data:{
pageNo:1,
keyWord:keyWord
},
success:function(data){
location.href='/DataMarket/searchResult?keyWord='+keyWord
},
})
})
接收页面
$(function ttt(){
var keyWord="";
var url = location.search
if (url.indexOf("?") != -1) {
var str = url.substr(1);
strs = str.split("=");
keyWord=strs[1];
$('#search_input').val(keyWord);
$("#ss").click();
}
console.log(keyWord);
})
3.显示的前后关系 z-index
css很基础的内容,把要显示在后面的内容设置成z-index:-1
4.关于jQuery 事件 - ready() 方法
就是指当 DOM(文档对象模型) 已经加载,并且页面(包括图像)已经完全呈现时,会发生 ready 事件。
所以把自动加载的方法放在里面,把其他的放在$(function)外面
5.表单提交绑定回车键的问题
$("#searchInput").keydown(function() {
if(event.keyCode=="13"){
$("#searchBtn").click();
}
});
在写搜索的时候,把回车键和搜索按钮绑定,结果是按下回车后自动刷新页面。
为了解决这种问题,只要 οnkeydοwn=”if(event.keyCode==13)return false;”把这句写在from标签里面就好了。
详细可见 http://www.jb51.net/article/50006.htm
6.汉字传值的解码
js传值的时候,会把字符转码,这会导致汉字(等)接受的时候成为编码格式。
只要在接受的参数外加上encodeURI() 方法就好了。
7.ajax
dataType的默认方式是String类型。如果后台传过来的是 json类型的数据,那么dataType必须设置成json
回调函数
如果要处理 $.ajax() 得到的数据,则需要使用回调函数:beforeSend、error、dataFilter、success、complete。
8.struts2下两种action往前台传值的方法
①利用ActionContext.getContext().put(“X”,X);
方法传值,然后前台直接用${X}获取
详细见 http://blog.csdn.net/smcfy/article/details/5693481
②利用jsonArray,jsonObject封装,然后前台通过ajax获取
比较推荐第二种方法,因为不需要跳转页面。
9.小插件
前台推荐些使用类似于http://t4t5.github.io/sweetalert/
这种插件,让界面更美观