弹出菜单

使用弹出菜单需要先载入JS文件：

<script src="/static/auicss/script/aui-popup-new.js"></script>

使用弹窗之前需要先实例化对象 var popup = new auiPopup();，支持方法如下：

• init(options, callback)：显示带成功图标的弹窗

options 参数如下：

params: {
    location: '', //（可选）位置，top(默认：顶部中间),top-left top-right,bottom,bottom-left,bottom-right
    buttons: [{ // 弹窗内容，对象数组
        image: '', // 菜单图标
        text: '', // 菜单文字
        value: '', // 菜单对应值（可选）
    }],
}

callback 回调参数如下：

function callback(res) {
    res.buttonIndex // 点击的菜单序号，从1开始记数
    res.buttonValue // 点击的菜单对应值，如buttons中未设置，此处为空
}

示例源码

<section class="aui-content-padded">
    <div class="aui-btn aui-btn-primary" tapmode onclick="showPopup('top-left')">左上角</div>
    <div class="aui-btn aui-btn-primary" tapmode onclick="showPopup('top')">顶部中间</div>
    <div class="aui-btn aui-btn-primary" tapmode onclick="showPopup('top-right')">右上角</div>
</section>
<section class="aui-content-padded">
    <div class="aui-btn aui-btn-info" tapmode onclick="showPopup('bottom-left')">左下角</div>
    <div class="aui-btn aui-btn-info" tapmode onclick="showPopup('bottom')">底部中间</div>
    <div class="aui-btn aui-btn-info" tapmode onclick="showPopup('bottom-right')">右下角</div>
</section>
<section class="aui-content-padded">
    <p>点击了第<strong class="aui-text-danger" id="button-index"></strong>个按钮（buttonIndex）</p>
    <p>点击按钮的值为<strong class="aui-text-danger" id="button-value"></strong>(buttonValue)</p>
</section>
<script type="text/javascript" src="/static/auicss/script/aui-popup-new.js" ></script>
<script type="text/javascript">
    var popup = new auiPopup();
    function showPopup(location){
        popup.init({
            location:location,//位置，top(默认：顶部中间),top-left top-right,bottom,bottom-left,bottom-right
            buttons:[{
                image:'/static/auicss/img/share/wx.png',
                text:'微信',
                value:'wx'//可选
            },{
                image:'/static/auicss/img/share/wx-circle.png',
                text:'朋友圈',
                value:'wx-circle'
            },{
                image:'/static/auicss/img/share/qq.png',
                text:'QQ好友',
                value:'qq'
            },{
                image:'/static/auicss/img/share/qzone.png',
                text:'QQ空间',
                value:'qq-qzone'
            },{
                image:'/static/auicss/img/share/sina-weibo.png',
                text:'新浪微博'
            }],
        },function(ret){
            if(ret){
                document.getElementById("button-index").textContent = ret.buttonIndex;
                document.getElementById("button-value").textContent = ret.buttonValue;
            }
        })
    }
</script>