Ajax做列表无限加载和Ajax做二级下拉选项
//栏目Ajax做加载
public function ajaxlist(){
//echo "http://www.域名.com/index.php?a=Index&c=Index&m=ajaxlist";
//echo "<hr>";
$data = Q('sum');
$where = array();
$where['cid'] = 33;
$rongyuList = M('content')->limit($data,2)->where($where)->select();
$data['stat'] = 1;
$data = $rongyuList;
$this->ajax($data);
//也可以手动把想要的字段拼接成字符串
/*echo "[";
foreach($rongyuList as $k){
echo "{"."\""."title"."\"".":"."\"".$k['title']."\"".","."\""."description"."\"".":"."\"".$k['description']."\"".","."\""."cid"."\"".":"."\"".$k['cid']."\""."}".",";
}
echo "]";*/
}
具体页面实现:
<script type='text/javascript'>
/*ajax*/
(function(){
//发送数据
var url = "__WEB__"+"?a=Index&c=Index&m=ajaxlist";
var oSum = '';
$('a.ajaxBut').click(function(){
oSum = $('div.zizhiListContBox>a').size();
$.post(url,{sum:oSum},function(result){
console.log(result);
eval("var info="+result);
for(var key in info){
oStr = "<a href='"+"__WEB__"+"?a=Index&c=Index&m=content&mid=1&cid=33&aid="+info[key]['aid']+""+"'><h3 class='f100 f16 ts500'>"+info[key]['title']+"</h3><p>"+info[key]['description']+"</p><span class='b parb'></span></a>";
$('div.zizhiListContBox').append(oStr);
};
});
});
})();
</script>
Ajax 做二级选项:
<!-- 示例:HTML -->
<dl class="pr keshi" >
<dt class="pa">科室:</dt>
<dd class="pa">
<select name='keshi' class='m_keshi'>
<option value='0'>--请选择科室--</option>
</select>
<select name='zhuanjia' class='m_zhuanjia'>
<option>--请选择专家--</option>
</select>
</dd>
</dl>
示例控制器:
//示例控制器
/* Ajax请求栏目列表 */
public function ajaxlanmu(){
$lanmuList = M('category')->where('pid=142')->select();
$this->ajax($lanmuList);
}
public function ajaxzhuanjia(){
$where = array();
$data = Q('sum');
$data = $data ? $data : 143;
$where['cid'] = $data;
$zhuanjiaList = M('guahao')->where($where)->select();
$this->ajax($zhuanjiaList);
}
示例:JS
<script>
(function(){
var lanmuUrl = "__WEB__"+"?a=Index&c=Index&m=ajaxlanmu";
var zhuanjiaUrl = "__WEB__"+"?a=Index&c=Index&m=ajaxzhuanjia";
var oSum = oStr = oStr2 = oVal = oKong = info2 = oCid = '';
/* lanmu */
$.post(lanmuUrl,function(result){
eval("var info="+result);
for(var key in info){oStr += "<option value='"+info[key]['catname']+"' cid='"+info[key]['cid']+"'>"+info[key]['catname']+"</option>";};
$('dl.keshi').find('select.m_keshi').append(oStr);
});
/* zhuanjia */
$('dl.keshi').find('select.m_keshi').change(function(){
oVal = $(this).find('option:selected').val();
if(oVal == 0){
$('dl.zhuanjia').find('select.m_zhuanjia').html("<option>--请选择专家--</option>");
}else{
oCid = $(this).find('option:selected').attr('cid');
$.post(zhuanjiaUrl,{sum:oCid},function(result){
eval("info2="+result);
oStr2 = '';//注意这里要清空第一次请求的数据
for(var key2 in info2){
oStr2 += "<option value='"+info2[key2]['title']+"'>"+info2[key2]['title']+"</option>";
};
$('dl.zhuanjia').find('select.m_zhuanjia').html(oStr2);
});
};
});
})();
</script>
Ajax做列表无限加载和Ajax做二级下拉选项的更多相关文章
- Qt实现小功能之列表无限加载
概念介绍 无限加载与瀑布流的结合在Web前端开发中的效果非常新颖,对于网页内容具备较好的表现形式.无限加载并没有一次性将内容全部加载进来,而是通过监听滚动条事件来刷新内容的.当用户往下拖动滚动条或使用 ...
- Qt实现小功能之列表无限加载(创意很不错:监听滚动条事件,到底部的时候再new QListWidgetItem)
概念介绍 无限加载与瀑布流的结合在Web前端开发中的效果非常新颖,对于网页内容具备较好的表现形式.无限加载并没有一次性将内容全部加载进来,而是通过监听滚动条事件来刷新内容的.当用户往下拖动滚动条或使用 ...
- SageCRM 页面加载完后,用下拉框联动修改放大镜字段的取值范围
原理很简单就是修改放大镜属性中的sql. 函数如下:第一个参数是字段的名称.第二个参数是需要控制这个放大镜的sql.可以跟进下拉框的值来组织这个sql. /*--------------- For C ...
- Vue中实现一个无限加载列表
参考 https://www.jianshu.com/p/0a3aebd63a14 一个需要判断的地方就是加载中再次触发滚动的时候,不要获取数据. <!DOCTYPE html> < ...
- 向上滚动或者向下滚动分页异步加载数据(Ajax + lazyload)[上拉加载组件]
/**** desc : 分页异步获取列表数据,页面向上滚动时候加载前面页码,向下滚动时加载后面页码 ajaxdata_url ajax异步的URL 如data.php page_val_name a ...
- Jquery ajax ajaxStart()和ajaxStop()加载前的优雅表现
Jquery中当一个Ajax请求启动时,并且没有其他未完成的Ajax请求时,将调用ajaxStart()方法.同样,ajaxStop()方法则是在所有Ajax请求都完成时调用.这些方法的参数都是一个函 ...
- 网页异步加载之AJAX理解
AJAX AJAX介绍 AJAX = Asynchronous JavaScript and XML(异步的 JavaScript 和 XML). AJAX 是一种用于创建快速动态网页的技术 AJAX ...
- 利用CSS、JavaScript及Ajax实现图片预加载的三大方法
预加载图片是提高用户体验的一个很好方法.图片预先加载到浏览器中,访问者便可顺利地在你的网站上冲浪,并享受到极快的加载速度.这对图片画廊及图片占据很大比例的网站来说十分有利,它保证了图片快速.无缝地发布 ...
- 图片预加载和AJAX的图片预加载
利用js实现图片预加载,加载所需要图片的路径与名称即可,很容易实现,该方法尤其适用预加载大量的图片: <div class="hidden"> <script t ...
随机推荐
- javascript关于onclick()
1 <html> <head> <title>js1 </title> <style> #content{ margin:0 auto; t ...
- mysql中如何查看某个日期所在的周一是几号?某个日期所在的一周开始时间是几号?
需求描述: 在编写SQL的时候,有这么个需求,就是要查出来某个日期所在的周一是几号,进行了测试,在此进行记录下. 测试过程: 议题:查看某个日期所在的周一是几号 分析:如果某个日期是周一,那么加上整数 ...
- apt-get/dpkg常用指令备查
apt-get install <package> Downloads <package> and all of its dependencies, and installs ...
- Android文件系统编译出错记录
错误1: 注意:external/protobuf/java/src/main/java/com/google/protobuf/GeneratedMessageLite.java 使用了未经检查或不 ...
- Python查找文件
1. 利用字符串的前缀和后缀匹配查找文件 str.startswith() star.endswith() 2.使用fnmatch fnmatch 判断文件名是否符合特定模式 ...
- api 25 PopupWindow会占据整个屏幕
解决方法:if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.N) { // Android 7.x中,PopupWindow高度为match_pa ...
- 如何将一个项目打成war包?
如何将一个项目打成war包?进入该项目所在目录jar -cvf myProjec.war myProject
- Matlab 图像处理入门
一些(形态学)图像处理方法如下: I = imread('pic.jpg'); I2 = rgb2gray(I); figure,imshow(I); title('原图'); figure,imsh ...
- python框架---->BeautifulSoup的使用
Beautiful Soup 是一个可以从HTML或XML文件中提取数据的Python库.它能够通过你喜欢的转换器实现惯用的文档导航,查找,修改文档的方式.一个人至少拥有一个梦想,有一个理由去坚强.心 ...
- Ubuntu 14.04 DNS 配置
最近得到一个比较好用的DNS,每次重启后都修改DNS配置文件 /etc/resolv.conf 重启就会失效 从网上得知 /etc/resolv.conf中的DNS配置是从/etc/resolvcon ...