您的位置:首页 > 其它

ajax get

2015-09-13 14:30 267 查看
1、html

<a href="{:U('changeStatus',array('id'=>$row['id'],'status'=>-1))}" class="ajax-get" title="移除">移除</a>

2、引入jquery

<script type="text/javascript" src="__JS__/jquery-1.11.1.js"></script>

3、css代码

.fixed{
position: fixed!important;
}
/* 提醒框 来自于onethink*/
.alert {
color: #c09853;
font-weight: bold;
border: 1px solid #fbeed5;
background-color: #fcf8e3;
}
.alert .close {
float: right;
position: relative;
top: -2px;
right: -21px;
font: bold 20px/20px arial;
color: #c09853;
opacity: 0.4;
}
.alert .close:hover {
opacity: 0.6;
}
button.close {
padding: 0;
cursor: pointer;
border: 0 none;
background: none;
}
.close {
float: right;
font-size: 20px;
font-weight: bold;
line-height: 20px;
color: #000000;
text-shadow: 0 1px 0 #ffffff;
opacity: 0.2;
filter: alpha(opacity=20);
}
.alert-info {
background-color: #D9EDF7;
border-color: #BCE8F1;
color: #3A87AD;
}
.alert-error {
color: white;
border-color: #eed3d7;
background-color: #FF6666;
}
.alert-success {
color: #468847;
background-color: #CCFF99;
border-color: #eed3d7;
}
#top-alert {
display: block;
top: -10px;
left: 10px;
right: 11px;
z-index: 3000;
margin-top: 20px;
padding-top: 12px;
padding-bottom: 12px;
overflow: hidden;
font-size: 16px;
}
#top-alert .close{
right:14px;
position: fixed;
top:4px;
}
.alert-content{
margin-left: 14px;
max-width:600px;
word-wrap: break-word;
word-break: break-word;
}


4、js代码

$(".ajax-get").click(function(){
var target = $(this).attr('href');
console.debug(target);
$.get(target,function(data){
console.debug(data);
var top_alert = $("#top-alert");
if(data.status){
top_alert.addClass('alert-success');
} else {
top_alert.addClass('alert-error');
}
$('.alert-content').text(data.info);
top_alert.show();
setTimeout(function(){
if(data.url){
location.href =data.url;
}else{
location.reload(true);
}
},'2000');
});
return false;
});
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: