无纸化教育传媒 伴随着您成长 伴随着您进步
首页 > 下载 > 下载详文：ASP.NET、JSP、PHP的Jquery提交

ASP.NET、JSP、PHP的Jquery提交

发布时间：2011年07月09日 11时44分56秒   属性：程序Web开发 > Web综合    访问次数：139705
字体：大 初始 小 简 繁 添加收藏 分享给好友
ASP.NET、JSP、PHP的Jquery post、get提交

Web开发Jquery ajax() post提交是目前应用广泛的方法，在ASP.NET、JSP、PHP三种web语言开发中，ASP.NET有自身的Ajax框架，在.NET FrameWork 3.0提供了Ajax组件(AJAX Control Toolkit应用于服务器控件)，Visual studio2010又将Jquery纳入ASP.NET项目，在ASP.NET MVC中目前又增加MicrosoftAjax.js框架，MicrosoftAjax.js系列框架已不比Jquery的功能弱(只是Jquery的突出的html元素样式控制)，虽然目前大部分用在ASP.NET MVC项目里，但是同时也能用以其它环境下的web客户端开发，本文将主要介绍Jquery应用在ASP.NET、JSP、PHP中的数据表单提交和传输。本文和前面 ASP.NET、PHP、JSP的POST提交 有相似之处，只是前面的是以传统的 post提交，而本文采用Jquery的post的set方式提交。

ASP.NET Jquery 提交

 ASP.NET 采用Jqurty post 或 get方式提交，在PageGetdata.htm页面中通超链接（id为putLink）提交给ASP.NET的Default.aspx，然后通过div（id为myPass）显示回发数据， 在Default.aspx页面后台输出当前系统时间和提交weisim3Page参数的值。下面是在PageGetdata.htm代码。

HTML 代码  复制
<!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>
<title></title>
<script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
//GET提交
$("a#putLink").click(function () {
    $.get("Default.aspx", { weisim3Page: "www.weisim3.com" }, function (response) {
        //alert(response);
        $("#myPass").text(response);
    });
});

$("a#putLink").click(function () {
    $.get("Default.aspx", "weisim3Page=www.weisim3.com", function (response) {
        //alert(response);
        $("#myPass").text(response);
    });
});

//POST提交
$("a#putLink").click(function () {
    $.post("Default.aspx", "weisim3Page=www.weisim3.com", function (response) {
        alert(response);
        $("#myPass").text(response);
    });
});
//POST提交
$("a#putLink").click(function () {
  $.post("Default.aspx",{ weisim3Page: "www.weisim3.com" }, function (response) {
        //alert(response);
        $("#myPass").text(response);
    });
});
        
})
</script>
</head>
<body>
   
<a href="#" id="putLink">Get Server Time</a>
<div id="myPass" style=" padding:3px; color:Blue"></div>

</body>
</html>

上面代码运行结果，在本示例实际文件中是注释其中任意三个按钮方法挨个测试结果

 JSP Jquery 提交

在JSP的Jquery post或get提交提方式中，本示例通过index.html提交，在超链接（id为inServer）触发Click事件，进行Jquery post或get提交给DataSet.jsp，同时在页面加入了input text 用以输入字符提交给JSP，然后依然是div（id为myPass）显示回发数据，在DataSet.jsp输出在index.html的Input text的值。下面是代码。

HTML 代码  复制
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<script src="Script/jquery-1.4.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
$("#inServer").click(function () {
$.post("DataSet.jsp", "Name="+$('#name').val(), function (response) {
    $("#myPass").text(response);
});

$("#inServer").click(function () {
 $.post("DataSet.jsp", {Name:$('#name').val()}, function (response) {
    $("#myPass").text(response);
});/* */

//get 方法
$("#inServer").click(function () {
$.get("DataSet.jsp", "Name="+$('#name').val(), function (response) {
        $("#myPass").text(response);
   });
});
//get 方法 
$("#inServer").click(function () {
$.get("DataSet.jsp", {Name:$('#name').val()}, function (response) {
        $("#myPass").text(response);
   });
});
});
</script>
</head>
<body>
    <input id="name" type="text" />
    <a href="#" id="inServer">Get Server</a>
    <div id="myPass"></div>
</body>
</html>

JSP Jquery post或get提交，在本示例实际文件项目中注释任意三个Click方法挨个测试结果

PHP Jquery提交

PHP Jquery提交示例中在index.html页面中放入input text（id为name），通过按钮（id为btn_PutIn）的Click触发提交，然后还是用div(id为text)显示回发数据，在Default.php中同样输出input text的值，下面代码。

HTML 代码  复制
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>PHP Jquery</title>
<script type="text/javascript" src="../Scripts/jquery-1.4.1.min.js">
</script>
<script type="text/javascript">
$(document).ready( function () {
$('#btn_PutIn').click ( function () {
/*$.post("Default.php", {name:$('#name').val()},function (response) {
    //alert(response);
    $("#text").text(response);
} );*/
$.post("Default.php", "name="+$('#name').val(),function (response) {
    //alert(response);
    $("#text").text(response);
} );
/* $.get("Default.php", {name:$('#name').val()}, function (response) {
   //alert(response);
   window.setTimeout($("#text").text(response),1000) ;
  
});*/
});
})
</script>
</head>
<body>
<div id="text" ></div>
<input type="text" id="name" name="name" />
<input type="button" value="提交" id="btn_PutIn"/>
</body>
</html>

PHP Jquery post 提交效果演示

本文介绍了三种语言平台采用Jquery post或get方式提交，关于Jquery post和get提交更加详细的介绍可以参考官方地址http://api.jquery.com/jQuery.post/和http://api.jquery.com/jQuery.get/ (Jquery官方介绍示例展示一般以PHP为主)。

下载文件提示：

  • ASP.NET jquery 提交 ------ JqueryAspNet文件夹（可以直接打开运行）
  • JSP jquery 提交 ------- JqueryJSP文件夹（将自文件夹web拷贝至自己项目即可）
  • PHP jquery提交 ------- JqueryPHP文件夹（将自文件夹拷贝至自己项目即可）
免费
ASP.NET、JSP、PHP的Jquery提交 （10）
本下载连接不支持第三下载工具打开，请直接点击下载即可
文章版权归属weisim3.com所有,未经书面版权许可同意，不得私自转载(或做修改转载)，源文件示例仅供学习使用，更不要出于商业用途或印刷出版发行！否则将追究其相关法律责任，版权联系QQ：729260499。
您可能感兴趣的软件资讯
最新世界软件资讯
×
遺昕 | Weisim3.com 下载许可条款 ( 您必须接受同意才可下载 ) .