Ajax效果--个人收藏
$.ajax({
url: "../../../Tools/WeChatMenu.ashx?action=get_menu",
type: "post",
data: { "appid": $("#use").attr("app_id") },
beforeSend: function (XMLHttpRequest) {
showout(1,"正在请求数据...");
},
success: function(data) {
hiddenoutbox(); //成功后隐藏弹出层
var json = $.parseJSON(data);
var bizmenu = $("#bizmenu"),
dialogBox = $("#dialogBox")
if (json.msg == 1) {
$.each(json.msgbox, function(i, item) {
$("#level1").find(".nav_btn").html(item.data_name);
$("#level1").find(".nav_btn").attr("db_id", item.id);
$("#level1").children().attr("id", "level1_" + i);
bizmenu.append($("#level1").html());
$("#level1").attr("data-domid", i);
if (item.stair_list != null) //有子菜单
{
var bizmenu_name = $("#bizmenu_name"),
dialogBox = $("#dialogBox"),
menuHtml = $("#level2_1").html();
$.each(item.stair_list, function(j, item2) {
$("#level1_" + i).find(".sub_nav_list").append(menuHtml);
$("#level2_1_1").attr("id", "level2_1_" + j);
$("#" + "level2_1_" + j).find(".level2name").html(item2.data_name);
$("#" + "level2_1_" + j).find(".level2name").attr("db_id", item2.id); }) }
})
}else
{
showout(0,json.msgbox);
window.setTimeout(hiddenoutbox,3000);
}
},
error:function(XMLHttpRequest, textStatus, errorThrown){
showout(0,"状态:" + textStatus + ";出错提示:" + errorThrown);
window.setTimeout(hiddenoutbox,3000);
}
})
弹出层样式:
.showoutbox{width:300px; min-height:32px; position:absolute; top:0; z-index:300; background:#0F0; display:none; text-align:center; line-height:32px;color:#fff}
.underbox{width:100%; background:#000; filter: alpha(opacity=0);-moz-opacity: 0;opacity: 0; z-index:299; position:absolute; left:0; top:0; display:none;}
弹出层方法:
//弹出层方法
function showout(status,datatext){
$(".showoutbox").html(datatext);
var myleft=($(window).width()-300)/2+'px';
if(status==1)
$(".showoutbox").css({left:myleft,display:'block',background:'#529E45'});
else if(status==0)
$(".showoutbox").css({left:myleft,display:'block',background:'#ED973A'});
$(".underbox").css({height:$(window).height()+'px',display:'block'});
}
//关闭弹出层
function hiddenoutbox(){
$(".showoutbox").text("");
$(".showoutbox").removeAttr("style");
$(".underbox").removeAttr("style");
} //status=0或1,代表失败或成功,datatext=提示的文本
层:
<div class="showoutbox"></div>
<div class="underbox"></div> //不能放到任何div下,直接放到body下
Ajax效果--个人收藏的更多相关文章
- C# Winform 实现Ajax效果自定义按钮
技术看点 WinForm自定义控件的使用 自定义控件gif动画的播放 需求及效果 又来一波 C# GDI自定义控件show .这个控件已经使用几年了,最近找出来重构一下.原来是没有边框的,那么导致导航 ...
- 使用script的src实现跨域和类似ajax效果
在解决js的跨域问题的时候, 有多种方式, 其中有一种是利用script标签的src属性,因为这个属性是不受域名限制的,我们可以直接让src的这个链接指向跨域网站的一个接口, 这个接口返回的是js代码 ...
- Ajax效果
Ajax的效果就是不通过网页的跳转,就可以通过请求,就可以自动加载某个网页,在注册帐号时,经常 不通过网页跳转从数据库中查看是否有相同数据的出现,确认是否能够正确注册 下面是用其他方式实现ajax的效 ...
- 天气预报的Ajax效果
最近在网站上看了很多显示实时天气预报的,挺实用而且用户体验也不错.对用户的帮助也比较大,用户可以通过你的网站了解到实时的天气信息.感觉比较有意思,于是自己钻研了一下其中的实现方法.于是决定把代码分享给 ...
- jQuery Mobile学习之grid、等待显示的ajax效果、页面跳转、页面跳转传递参数等(二)
Index.cshtml <!-- Start of second page --> <section data-role="page" id="bar ...
- thinkphp中ajaxReturn方法实现ajax效果
前台代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF ...
- IFrame实现的无刷新(仿ajax效果)...
前台代码: <iframe style="display:none;" name="gg"></iframe> <form act ...
- js+html实现遮罩层效果(收藏哦)
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <script ty ...
- 自定义ajax,添加loading效果
自定义ajax /** * @desc 自定义ajax请求,添加等待gif */ var n=0; $.defineAjax=function(obj){ n++; if(!$('#loadingDi ...
随机推荐
- 使用idea2017搭建SSM框架(转发:https://www.cnblogs.com/hackyo/p/6646051.html#!comments)
步骤: 一.首先使用idea新建一个Maven webapp项目 点击Finish,第一次搭建可能会很慢,甚至可能需要VPN才能搭建成功 二.搭建目录结构 我这里列出的是搭建完了之后所有的目录和文件, ...
- 找出旋转有序数列的中间值python实现
题目给出一个有序数列随机旋转之后的数列,如原有序数列为:[0,1,2,4,5,6,7] ,旋转之后为[4,5,6,7,0,1,2].假定数列中无重复元素,且数列长度为奇数.求出旋转数列的中间值.如数列 ...
- 为什么下了android 4.1 的SDK后在本地用浏览器看api说明文档时,浏览器打开api的html文件很慢?试了好几款浏览器都一样。为什么?
http://www.oschina.net/question/436724_61401 http://www.google.com/jsapi 他惹的祸 注释掉就可以了- <!-- < ...
- NVM安装配置
http://www.kancloud.cn/summer/nodejs-install/71975 配置源 http://www.cnblogs.com/kaiye/p/4937191.html 安 ...
- 模仿jquery框架源码 -成熟---选择器
<!DOCTYPE HTML> <html lang="en-US"> <head> <meta charset="UTF-8& ...
- poj 3006 Dirichlet's Theorem on Arithmetic Progressions【素数问题】
题目地址:http://poj.org/problem?id=3006 刷了好多水题,来找回状态...... Dirichlet's Theorem on Arithmetic Progression ...
- 剑指offer之 数组中出现次数超过一半的数字
public class Solution { public int MoreThanHalfNum_Solution(int [] array) { if(array==null||array.le ...
- linux学习-环境变量与文件查找
- php设计模式课程---1、什么是设计模式
php设计模式课程---1.什么是设计模式 一.总结 一句话总结:经典场景的经典解决方法. 经典场景的经典解决方法 1.设计模式使用的通俗场景有哪些? 比如:拍电影时,常用设计模式 感情狗血剧:误会模 ...
- spring事务隔离级别以及脏读 不可重复读 幻影读
隔离级别 声明式事务的第二个方面是隔离级别.隔离级别定义一个事务可能受其他并发事务活动活动影响的程度.另一种考虑一个事务的隔离级别的方式,是把它想象为那个事务对于事物处理数据的自私程度. 在一个典型的 ...