Since 8.2

setToolbarMenu

自定义分享面板第二栏的工具栏内容。

注意：由于苹果的ATS限制，icon URL必须为https链接或base64，http链接会被忽略

使用方法

AlipayJSBridge.call('setToolbarMenu', {
  menus: [
    {
      name: "字体",
      tag: "H5MenuActionOfFont",
      icon: "https://os.alipayobjects.com/rmsportal/SuHlTsUNSyJvRzn.png"
    },
    {
      name: "菜单项2",
      tag: "cm2"
    },
    {
      name: "菜单项3",
      tag: "cm3"
    }
  ],
  override: false
}, function() {
  // do something
});

代码演示

设置工具栏菜单项列表

<button id="J_setOverrideValue" class="btn">override(false)</button>
<button id="J_setResetValue" class="btn">reset(false)</button>

<script>
function ready(callback) {
  // 如果jsbridge已经注入则直接调用
  if (window.AlipayJSBridge) {
    callback && callback();
  } else {
    // 如果没有注入则监听注入的事件
    document.addEventListener('AlipayJSBridgeReady', callback, false);
  }
}
ready(function(e) {
  var options = {
    menus: [
      {
        name: "字体",
        tag: "H5MenuActionOfFont",
        icon: "https://os.alipayobjects.com/rmsportal/SuHlTsUNSyJvRzn.png"
      },
      {
        name: "菜单项2",
        tag: "cm2"
      },
      {
        name: "菜单项3",
        tag: "cm3"
      }
    ],
    override: false,
    reset: false
  };

  document.querySelector('#J_setOverrideValue').addEventListener('click', function(e) {
    options.override = !options.override;
    e.target.innerText = 'override(' + options.override.toString() + ')';
    updateOptions();
  }, false);

  document.querySelector('#J_setResetValue').addEventListener('click', function(e) {
    options.reset = !options.reset;
    e.target.innerText = 'reset(' + options.reset.toString() + ')';
    updateOptions();
  }, false);

  function updateOptions() {
    AlipayJSBridge.call('setToolbarMenu', options, function(result) {
      alert(JSON.stringify(result));
    });
  }

  updateOptions();

  document.addEventListener('toolbarMenuClick', function(e) {
    alert(JSON.stringify(e));
  }, false);
});
</script>

查看演示

扫码查看

用支付宝扫码运行

API

AlipayJSBridge.call('setToolbarMenu',{
  menus: {
    name, tag, icon
  }, override, reset
})

入参

名称	类型	描述	必选	默认值
menus	array	菜单列表，默认显示于容器默认菜单项的右上角,icon使用容器默认icon（五角星）。 name:表示菜单项显示内容，必须控制在4个字符（含）以内，否则容器会截断4个字显示（必须填写）； tag:表示菜单项的唯一标签（必须填写）； icon:可自定义icon，传入图片url（非必填）；当菜单被点击后，传入的值都会被返回；当override为false时，用户自定义菜单个数必须小于5个。	Y
override	bool	是否覆盖容器自带的菜单列表	N	false
reset	bool	是否重置菜单到系统默认，当reset=true时，忽略其他参数	N	false

出参

回调函数带入的参数result: {result}

名称	类型	描述	版本
result.status	string	“Success”:添加菜单项成功

JSAPI

setToolbarMenu

使用方法

代码演示

设置工具栏菜单项列表

API

入参

出参