zoukankan      html  css  js  c++  java
  • 企业微信通讯录替换Picker问题

    <div class="weui_input" id="drpPerson" data-values="11111" data-picker="[object Object]" 
    style
    =""><ww-open-data type="userName" openid="xxxx"></ww-open-data></div>

    如上面html,在使用picker时,因为html才能自动显示姓名,所以这里用div,而不是input

     点区域1正常,点区域2不能弹出,通过审查元素,发现点击2时其实也弹出了,只不过没有显示出来,每点一次都会产生一段html,按说picker弹出的是Modal的不会消失的,初步分析是冒泡导致的

    $("#drpPerson").on('click', "ww-open-data", function () {
                               return false;
                           });

    增加上面代码阻止冒泡解决问题.

    较完整代码

    $("#drpPerson").picker({
            title: "选择审批人员",
            cols: [
                {
                    textAlign: 'center',
                     '100%',
                    values: p_arrayusers,
                    displayValues: p_arraydisplayusers
                }
            ],
            onOpen: function (p, v, d) {
                renderTxlBind();
            },
            onClose: function(p, v, d) {
                if (p.displayValue != undefined) {
                    $("#drpPerson").html(p.displayValue[0]);
                    $("#drpPerson").attr("data-values", p.value);
                    renderTxlBind();
                }
            },
            onChange: function (p, v, d) {
                if (p.displayValue != undefined) {
                    $("#drpPerson").html(p.displayValue[0]);
                    $("#drpPerson").attr("data-values", p.value);
                    renderTxlBind();
                }
            }
        },
        true);
     renderTxlBind();
    function renderTxlBind() {
        if (document.querySelectorAll('ww-open-data').length > 0) {
                    if (window.WWOpenData != undefined) {
                        WWOpenData.bindAll(document.querySelectorAll('ww-open-data'));
                    }
                }
    }

     另外

    http://jqweui.com/extends#picker

    该版本的picker不支持html标签,如果使用html标签会原样显示出来。以后尽量使用weio.io版本的。

  • 相关阅读:
    Sql server数据库设计 7
    day08作业
    day01作业
    day07作业.
    day05作业
    day04作业
    day02作业
    初学Java的一些注意事项
    day07作业
    Week03面向对象入门
  • 原文地址:https://www.cnblogs.com/zhaogaojian/p/13177067.html
Copyright © 2011-2022 走看看