无为清净楼资源网 Design By www.qnjia.com
首先我们新建一个网站,在网站里面新增一般处理程序,命名为ReadData.ashx。然后在里面输入如下代码:
复制代码 代码如下:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Services;
using System.Data.SqlClient; //引入命名空间
using System.Data;

namespace 加载层
{
/// <summary>
/// $codebehindclassname$ 的摘要说明
/// </summary>
[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
public class ReadData : IHttpHandler
{

public void ProcessRequest(HttpContext context)
{
//context.Response.ContentType = "text/plain";
//context.Response.Write("Hello World");

//获取外部传进来的变量值i
int i = Int32.Parse(context.Request.QueryString["i"]);

//连接数据库

SqlConnection con = new SqlConnection("data source=.;user id=sa;pwd=5239898;database=librarydatabase;");
con.Open();
SqlDataAdapter ada = new SqlDataAdapter("select * from reader where 序号='" + i + "'", con);
SqlCommandBuilder com = new SqlCommandBuilder(ada);
DataSet ds = new DataSet();
ada.Fill(ds, "reader");

con.Close();

//读取表中栏位为“姓名”的字段值,并传出

context.Response.Write(ds.Tables["reader"].Rows[0]["姓名"].ToString());


}

public bool IsReusable
{
get
{
return false;
}
}
}
}

然后我们需要新建一个JavaScript文件,命名为loaddata.js。输入如下代码:

复制代码 代码如下:

/*当DOM加载完毕之后就自动为两个链接添加Click事件*/
$("document").ready(function() {
$("a[href=javascript]").click(function() {
chkform();
return false;
})
$("a[href=test]").click(function() {
$("#load").css("display", "none");
$("#mark").css("display", "none");
return false;
})
});


var chkform = function() {
new Request({

/*调用一般处理程序进行后台抓取数据并返回txt变量*/
url: 'ReadData.ashx?i=' + $("#Text1").attr("value"),

/*抓取数据成功之后*/
onSuccess: function(txt) {
$("#load").append("<P>" + txt + "</P>");

$("#load").css("display", "block");
$("#mark").css("display", "block");
},

/*正在抓取*/
onRequest: function() {

$("#load").append("<P>正在加载</P>");
},

/*数据加载失败*/
onFailure: function() {
alert('信息加载失败!');

}
}).send();
}

还没完,我们还要新增一个CSS文件,命名为main.css,深入如下样式:
复制代码 代码如下:
#mark{
width: 100%;
background-color:White;
position:absolute;
left: 0px;
top: 0px;
height: 700px;
filter:alpha(opacity=70);
-moz-opacity:70;
opacity:70;
z-index:2;
display:none;
}
#load
{
background-color:Gray;
border: 1px solid #999;
font-size: 12px;
position:relative;
margin:0 auto;
margin-top:100px;
width:200px;
height:150px;
z-index:99;
display:none;
}



我们在网站的首页里面源码输入如下代码:
复制代码 代码如下:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="加载层._Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>加载层</title>
<link type="text/css" href="main.css" rel="Stylesheet" />

<script type="text/javascript" src="/UploadFiles/2021-04-02/mootools.js">
<script type="text/javascript" src="/UploadFiles/2021-04-02/jquery-1.3.1-vsdoc.js">
<script type="text/javascript" src="/UploadFiles/2021-04-02/jquery-1.3.1.js">
<script type="text/javascript" src="/UploadFiles/2021-04-02/loaddata.js">
</head>
<body>
<div id="me">
<a href="javascript">点击加载</a>
<input id="Text1" type="text" /></div>
<div id="load">
load <a href="test">试试</a>
</div>
<div id="mark">
</div>
</body>
</html>

至此完成了我们要的效果。
效果图及DEMO一会放出。
Asp.net利用JQuery弹出层加载数据代码
看上面的链接以及文本框都处于“灰色”状态,不可编辑。点击中间弹出层的链接可以回到最初状态。整个过程中页面都没有刷新!

Demo下载地址: http://xiazai.jb51.net/200911/yuanma/asp.net_jquery_jiazaiceng.rar
标签:
Asp.net,JQuery,弹出层,加载数据

无为清净楼资源网 Design By www.qnjia.com
广告合作:本站广告合作请联系QQ:858582 申请时备注:广告合作(否则不回)
免责声明:本站文章均来自网站采集或用户投稿,网站不提供任何软件下载或自行开发的软件! 如有用户或公司发现本站内容信息存在侵权行为,请邮件告知! 858582#qq.com
无为清净楼资源网 Design By www.qnjia.com

《魔兽世界》大逃杀!60人新游玩模式《强袭风暴》3月21日上线

暴雪近日发布了《魔兽世界》10.2.6 更新内容,新游玩模式《强袭风暴》即将于3月21 日在亚服上线,届时玩家将前往阿拉希高地展开一场 60 人大逃杀对战。

艾泽拉斯的冒险者已经征服了艾泽拉斯的大地及遥远的彼岸。他们在对抗世界上最致命的敌人时展现出过人的手腕,并且成功阻止终结宇宙等级的威胁。当他们在为即将于《魔兽世界》资料片《地心之战》中来袭的萨拉塔斯势力做战斗准备时,他们还需要在熟悉的阿拉希高地面对一个全新的敌人──那就是彼此。在《巨龙崛起》10.2.6 更新的《强袭风暴》中,玩家将会进入一个全新的海盗主题大逃杀式限时活动,其中包含极高的风险和史诗级的奖励。

《强袭风暴》不是普通的战场,作为一个独立于主游戏之外的活动,玩家可以用大逃杀的风格来体验《魔兽世界》,不分职业、不分装备(除了你在赛局中捡到的),光是技巧和战略的强弱之分就能决定出谁才是能坚持到最后的赢家。本次活动将会开放单人和双人模式,玩家在加入海盗主题的预赛大厅区域前,可以从强袭风暴角色画面新增好友。游玩游戏将可以累计名望轨迹,《巨龙崛起》和《魔兽世界:巫妖王之怒 经典版》的玩家都可以获得奖励。