当前位置: 首页 > 工具软件 > EZo UIBuilder > 使用案例 >

EZo UIBuilder中嵌入微博分享按钮【实例】

林修真
2023-12-01

        EZo UIBuilder中除了可以通过GUL 标签快速画出gxt 效果的画面外,还可以轻松嵌入html标签及javascript,实现web端的任意扩展性。通过SN分享相关文章已成为网站不可缺少的一部分。以下为在GUL中嵌入sina 微博分享按钮的实例代码:

<page>
  <hp>
    <div id="sinaweibo">
    </div>
  </hp>
  <js init='js:this'>
    <![CDATA[
    var _w = 72 , _h = 16;
    var param = {
      url:location.href,
      type:'3',
      count:'1', /**是否显示分享数,1显示(可选)*/
      appkey:'', /**您申请的应用appkey,显示分享来源(可选)*/
      title:'', /**分享的文字内容(可选,默认为所在页面的title)*/
      pic:'', /**分享图片的路径(可选)*/
      ralateUid:'', /**关联用户的UID,分享微博会@该用户(可选)*/
      language:'zh_cn', /**设置语言,zh_cn|zh_tw(可选)*/
      rnd:new Date().valueOf()
    }
    var temp = [];
    for( var p in param ){
      temp.push(p + '=' + encodeURIComponent( param[p] || '' ) )
    }
    var sinaweiboDiv = document.getElementById("sinaweibo");
    //sinaweiboDiv.setAttribute("height",_h);
    //console.log(sinaweibo);
    sinaweibo.innerHTML = '<iframe allowTransparency="true" frameborder="0" scrolling="no" src="http://hits.sinajs.cn/A1/weiboshare.html?' + temp.join('&') + '" width="'+ _w+'" height="'+_h+'"></iframe>';
    ]]>
  </js>
</page>

1、<hp></hp>中可以嵌入html标签

2、<js></js>标签内写javascript代码

3、通过sina微博开放平台取得所需的分享按钮JS代码http://open.weibo.com/sharebutton

分享按钮应用在上篇文章EZo UIBuilder 快速打造沪深股市实时行情demo地址:http://www.ezoui.com.cn/tryit/User/w11056/sinastock.gul

Note:GUL标签含义请搜寻官方文档介绍,关键点用sinaweibo.innerHTML代码替代微博平台生成的document.write进行代码定位


 类似资料: