动态设置semantic-ui弹出层popup的内容

18-05-21 00:36 字数 453 阅读 5120 已编辑

关于popup官方的demo比较简单,显示一个固定内容的弹出层。

<div class="ui icon button" data-content="Add users to your feed">
  <i class="add icon"></i>
</div>

效果图如下

alttext

但是有时候我们希望popup的content是动态的,比如从服务器api获取。

这时就需要用到popup的callback了。

var popupLoading = '<i class="notched circle loading icon teal"></i>';
    $('[rel=author]').popup({
        hoverable  : true,
        exclusive: true,
        delay: {
            show: 400,
            hide: 400
        },
        html: popupLoading,
        variation: 'wide',
        onShow: function (el) {
            var popup = this;
            popup.html(popupLoading);
            $.ajax({
                url: '/user_summary',
                data: {uid: $(el).data('uid')},
                method: 'post'
            }).done(function(result) {
                popup.html(result);
            }).fail(function() {
                popup.html('error');
            });
        }
    });
1人点赞>
关注 收藏 改进 举报
6 条评论
排序方式 时间 投票
Yang-0724

改小了也不行 其他都正常就这个不行   所以我就想说问问 怎样可以让内容像左会不会好点

Up骚年
你这个是不是往下比较合适?data-position="bottom center"
Yang-0724

怎么可以把弹出层popup的方向改变向右呀?

Up骚年
加个属性 data-position="right center"
Yang-0724
回复 Up骚年: 他就变成这样了
查看全部3条回复 >>
请登录后发表评论
站长 @ 十七度
文章
384
粉丝
23
喜欢
195
收藏
31
排名 : 1
访问 : 147.28万
私信