文档章节

bootstrap中popover与ajax接合实现动态内容

webphp
 webphp
发布于 2017/07/26 11:28
字数 137
阅读 16
收藏 0
点赞 0
评论 0
//html内容
<a href="javascript:void(0);" class="popover1" data-id="<?php echo $val->id;?>">查看联系人</a>
//js内容
$('[data-toggle="popover"]').popover();//初始化popover
    $(".popover1").popover({
        html: true,
        placement: 'left',
        title: '查看联系人',
        content: function(){
            var order_id  = $(this).data('id');
            var div_id =  "tmp-id-" + order_id;
            return details_in_popup(div_id, order_id);
        }
    })
    //ajax获取内容
    function details_in_popup(div_id, order_id){
        $.post(BASE_URL+'/admanager/index.php/order/getContacts/', {'order_id':order_id}, function(res){
            if ( res.status > 0 ) {
                var show_html = "<dl><dt>称呼:</dt>";
                    show_html += "<dd>"+ res.info.real_name+"</dd>";
                    show_html += "<dt>手机:</dt>";
                    show_html += "<dd>"+res.info.mobile+"</dd>";
                    show_html +="</dl>";
               $('#'+div_id).html(show_html);
            }else{
                $('#'+div_id).html("<p class='text-danger'>获取内容失败</p>");
            }
        })
        return '<div id="'+ div_id +'">Loading...</div>';
    }
 

© 著作权归作者所有

共有 人打赏支持
webphp
粉丝 1
博文 91
码字总数 91650
作品 0
海淀
程序员
基于bootstrap的检验组件--bt-validate

这是一个基于bootstrap的检验组件,改编自网络。 利用了bootstrap的popover弹出组件 显示出错信息,允许用户在表单组件中使用自定义规则。没有考虑 通过ajax方式 服务器返回的验证信息情况。...

yunhaifeiwu ⋅ 2013/04/13 ⋅ 0

【翻译】Flask大型教程|第二十章:加点JavaScript魔法

本文翻译自The Flask Mega-Tutorial Part XX: Some JavaScript Magic 这是Flask Mega-Tutorial系列的第二十部分,我将添加一个功能,当你将鼠标悬停在用户的昵称上时,会弹出一个漂亮的窗口。...

一进制 ⋅ 04/18 ⋅ 0

bootstrapx-popoverx

Popoverx 是Bootstrap Popover控件的增强版,Popoverx主要有如下增强: 提供onShown和onHidden回调,具有更友好的Ajax交互方式 提供单实例方式的Popover弹出框 智能处理显示位置,重新调整P...

史涛 ⋅ 2013/01/10 ⋅ 0

响应式bootstrap管理员后台界面主题 - Charisma

Charisma是一套全功能的,免费,会员质量的响应式HTML5管理员界面模板,基于"Bootstrap",拥有了9套不同的主题颜色内容,可以满足你的不同需要! 在线演示 主要特性: 9套不同的主题 完全响应...

gbin1 ⋅ 2013/04/10 ⋅ 17

扩展Bootstrap Tooltip插件使其可交互

最近在公司某项目开发中遇见一特殊需求,请笔者帮助,因此有了本文的插件。在前端开发中tooltip是一个极其常用的插件,它能更好向使用者展示更多的文档等帮助信息。它们通常都是一些静态文本...

zting科技 ⋅ 2017/01/12 ⋅ 0

4.20、Bootstrap V4自学之路-----内容---提示框

我预计要歇菜,mark! 概述 在使用提示框插件的时候你需要知道这些: 提示框依赖第三方库Tether实现定位。你必须在bootstrap.js之前调用 tether.min.js,才能使提示框起作用。 提示框需要依赖...

Asktao ⋅ 2016/03/25 ⋅ 0

Bootstrap学习笔记--插件之Carousel插件轮播图片,模态插件,提示插件,滚动监听插件,Affix插件

轮播插件: 插件: 轮播插件。 是一个通过元素循环的组件,如旋转木马(幻灯片) 插件可以单独包含(使用Bootstrap“carousel.js”文件),或者一次全部使用(使用“bootstrap.js”或“boots...

codingcoge ⋅ 05/28 ⋅ 0

BootStrap利用popover实现鼠标经过显示并保持显示框

在商城里,导航栏的购物车展示经常需要鼠标经过时,显示已经放入购物车的商品,bootstrap是没有直接用的插件的,这个时候就可以使用popover这个插件改造后实现,具体如下: html实现: <a h...

Geomen ⋅ 2013/11/22 ⋅ 1

在bootstrap中popover.js,popover英文是什么意思?

在bootstrap中popover.js,popover英文是什么意思? popover ['pɒp,әuvә] n. 膨松饼,薄空心酥饼(因过松泡,常涨出烤型外); 明显看是不正确的翻译,很烦闷,死记硬记单词 。 图灵计算机词...

sinat_34719507 ⋅ 2016/12/18 ⋅ 0

网站管理后台模板--Charisma

Charisma 是基于 Twitter Bootstrap 制作的响应式网站管理后台模板,包含9套漂亮的主题。 主要特性: 9套不同的主题 完全响应式,针对了移动设备和触摸设备优化 基于bootstrap,同时也支持j...

匿名 ⋅ 2013/01/10 ⋅ 24

没有更多内容

加载失败,请刷新页面

加载更多

下一页

Spring Cloud构建微服务架构服务注册与发现

Spring Cloud简介 Spring Cloud是一个基于Spring Boot实现的云应用开发工具,它为基于JVM的云应用开发中涉及的配置管理、服务发现、断路器、智能路由、微代理、控制总线、全局锁、决策竞选、...

明理萝 ⋅ 29分钟前 ⋅ 0

占位slot

一、为什么我们需要slot 假如我们有个需要,子组件中需要显示一段html内容,显示什么不是由子组件决定,而是由父组件传递什么决定,我们该怎么做 很挫的做法,我们使用组件间的数据传递 父组...

金于虎 ⋅ 29分钟前 ⋅ 0

Linux集群 NTP 时间同步

基于CentOS 7 规划 比如有2台机器 IP 主机名 说明 192.168.103.51 cdh51 本地NTP服务端 192.168.103.52 cdh52 本地NTP客户端 安装NTP服务 每台机器都安装ntp yum -y install ntp NTP服务端(...

囚兔 ⋅ 32分钟前 ⋅ 0

国际版链克口袋 获取方法

1 月16日,网心科技玩客云团队在官网发布了停止链克口袋转帐服务的通知。通知中表示迅雷将于1月25日在AppStore和官网,正式发布链克口袋新版本,新版本不支持迅雷及迅雷合作伙伴开发的应用场...

xiaogg ⋅ 33分钟前 ⋅ 0

Raft中Batching和pipelining到底是什么?

Raft supports batching and pipelining of log entries, and both are important for best performance. Many of the costs of request processing are amortized when multiple requests a......

黑客画家 ⋅ 34分钟前 ⋅ 0

Mybatis-Plus 之BaseMapper 方法详解

/** * Mapper 继承该接口后,无需编写 mapper.xml 文件,即可获得CRUD功能 * 这个 Mapper 支持 id 泛型 * @author hubin * @Date 2016-01-23 */public interface BaseMapper<T> ...

干干 ⋅ 34分钟前 ⋅ 0

JVM笔记9-Class类文件结构

摘要: 1.Class类文件结构   Class 文件是一组以 8 位字节为基础单位的二进制流,各个数据项目严格按照顺序紧凑地排列在 Class 文件之中,中间没有添加任何分隔符,这使得整个 Class 文件中...

传授知识的天使 ⋅ 38分钟前 ⋅ 0

MySQL数据库之sleep线程过长如何处理?

  什么是sleep线程?   sleep线程长时间保持可客户端与服务端的连接状态   导致sleep过多的原因:   使用太多持久连接(高并发系统中 不适合使用持久连接)   程序中 没有及时关闭MyS...

老男孩Linux培训 ⋅ 38分钟前 ⋅ 0

转发和重定向的区别

转发在服务器端完成的;重定向是在客户端完成的 转发的速度快;重定向速度慢 转发的是同一次请求;重定向是两次不同请求 转发不会执行转发后的代码;重定向会执行重定向之后的代码 转发地址栏...

冯莉莉莉莉 ⋅ 39分钟前 ⋅ 0

go语言实现http proxy的关键一步

go语言自带包ReverseProxy 实现了proxy的功能。 但我希望proxy进程能够在代理的同时,完整的把请求和请求体记录在日志里。 仅使用ReverseProxy 包的话,uri记录没问题,但body只能被读取一次...

xuanzilie ⋅ 44分钟前 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部