使用ajax()方法加载服务器数据
使用ajax()方法加载服务器数据
使用ajax()
方法是最底层、功能最强大的请求服务器数据的方法,它不仅可以获取服务器返回的数据,还能向服务器发送请求并传递数值,它的调用格式如下:
jQuery.ajax([settings])
或$.ajax([settings])
其中参数settings为发送ajax请求时的配置对象,在该对象中,url表示服务器请求的路径,data为请求时传递的数据,dataType为服务器返回的数据类型,success为请求成功的执行的回调函数,type为发送数据请求的方式,默认为get。
<!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>使用ajax()方法加载服务器数据</title>
<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js" type="text/javascript"></script>
<style>
#divtest
{
width: 282px;
}
#divtest .title
{
padding: 8px;
background-color:Blue;
color:#fff;
height: 23px;
line-height: 23px;
font-size: 15px;
font-weight: bold;
}
ul
{
float: left;
width: 280px;
padding: 5px 0px;
margin: 0px;
font-size: 14px;
list-style-type: none;
}
ul li
{
float: left;
width: 280px;
height: 23px;
line-height: 23px;
padding: 3px 8px;
}
.fl
{
float: left;
}
.fr
{
float: right;
}
</style>
</head> <body>
<div id="divtest">
<div class="title">
<span class="fl">检测数字的奇偶性</span>
<span class="fr">
<input id="btnCheck" type="button" value="检测" />
</span>
</div>
<ul>
<li>请求输入一个数字
<input id="txtNumber" type="text" size="12" />
</li>
</ul>
</div> <script type="text/javascript">
$(function () {
$("#btnCheck").bind("click", function () {
$.ajax({
url:"./8-5.php",
data: { num: $("#txtNumber").val() },
type:"post",
success: function (data) {
$("ul").append("<li>你输入的<b> "
+ $("#txtNumber").val() + " </b>是<b> "
+ data + " </b></li>");
}
});
});
});
</script>
</body>
</html>
<?php
$num = $_POST['num'];
if($num%2==0){
echo "偶数";
}else{
echo "奇数";
}
使用ajax()方法加载服务器数据的更多相关文章
- ajax验证表单元素规范正确与否 ajax展示加载数据库数据 ajax三级联动
一.ajax验证表单元素规范正确与否 以用ajax来验证用户名是否被占用为例 1创建表单元素<input type="text" id="t"> 2 ...
- scrapy项目5:爬取ajax形式加载的数据,并用ImagePipeline保存图片
1.目标分析: 我们想要获取的数据为如下图: 1).每本书的名称 2).每本书的价格 3).每本书的简介 2.网页分析: 网站url:http://e.dangdang.com/list-WY1-dd ...
- AJAX 动态加载后台数据 绑定select
<select id="select"> <!--下拉框数据动态加载--> </select> js:(使用jquery) $(document ...
- easyui中 combogrid控件的loadData方法加载本地数据
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- ajax 未加载出数据时,显示loding,数据显示后,隐藏loading
$("#CreateReport").click(function () { // RptID,Template,TemplateType,FileName var RptID = ...
- Tree:加载列表数据
Tree控件,需要提供一个树形的JSON数据,才能正常显示. 通常,开发者在后台可以这样做: 1)从数据库查询出一个列表数据 2)在后台,将列表数据转换为树形数据 3)通过JSON方式返回 在前台页面 ...
- Python 爬取异步加载的数据
在我们的工作中,可能会遇到这样的情况:我们需要爬取的数据是通过ajax异步加载的,这样的话通过requests得到的只是一个静态页面,而我们需要的是ajax动态加载的数据! 那我们应该怎么办呢??? ...
- Ajax在jQuery中的应用(加载异步数据、请求服务器数据)
加载异步数据 jQuery中的load()方法 load(url,[data],[callback]) url:被加载的页面地址 [data]:可选项表示发送到服务器的数据,其格式为 key/valu ...
- jQuery.ajax( options ) : 通过 HTTP 请求加载远程数据
jQuery.ajax( options ) : 通过 HTTP 请求加载远程数据 这个是jQuery 的底层 AJAX 实现.简单易用的高层实现见 $.get, $.post 等. $.ajax() ...
随机推荐
- activiti搭建(二)与Spring集成
转载请注明源地址:http://www.cnblogs.com/lighten/p/5876773.html 本文主要讲解如何将Activiti和Spring框架集成,再过一段时间将会将一个基础的de ...
- MySQL中,把varchar类型转为date类型
如下表: 先使用str_to_date函数,将其varchar类型转为日期类型,然后从小到大排序 语法:select str_to_date(class_time,'%Y%m%d %H:%i:%s') ...
- 【Qt】Qt之进程间通信(QProcess)【转】
简述 前几节里,分享了进程通信的几种方式:Windows消息机制.Shared Memory(共享内存),本节讲解下关于进程通信的另外一种方式-QProcess. 简述 命令行参数启动 说明 实现 命 ...
- C# 编写Window服务基础(一)
一.Windows服务介绍: Windows服务以前被称作NT服务,是一些运行在Windows NT.Windows 2000和Windows XP等操作系统下用户环境以外的程序.在以前,编写Wind ...
- jQuery select的操作代码
jQuery對select的操作的实际应用代码. //改變時的事件 复制代码代码如下: $("#testSelect").change(function(){ //事件發生 j ...
- line-height属性使文字垂直居中原理
原理:line-height与font-size的计算之差(在CSS中成为“行间距”)分为两半,分别加到一个文本内容的顶部和底部,这样就使得文字垂直居中了.
- Ztack学习笔记(2)-系统初始化分析
main函数先执行初始化工作,包括硬件.网络层.任务等的初始化. 一 系统初始化 系统初始化函数主要完成内存分配.消息队列头.定时器.电源管理.任务系统及内存栈等的初始化,具体如下代码所示: //os ...
- 项目文件包含 ToolsVersion="12.0" 设置,而此版本的 MSBuild 不支持该工具版本
解决方法: 右键点击你的项目,选择属性,再点击配置属性中的常规,常规中有个平台工作集,把V120改成V100,点击应用即可.
- Ubuntu下Code::Blocks无法编译 /bin/sh: 1: g++ not found 解决办法
Linux下Code::Blocks无法编译运行提示 /bin/sh: 1: g++ not found 的解决办法 今天在Ubuntu 12.04 软件中心中选装了Code::Blocks,安装完成 ...
- Redis 四:存储类型之列表类型
.lpush num 依次从左边推入0 - .rpush num 依次从右边推入0 - .lrnage num - 显示num列表中所有的数据 结果: .lpop num 从左边删除并弹出一个元素 . ...