Question

我正在使用atlassian SDK为我们的JIRA实例开发自定义小工具。我根据显示的内容面临小工具动态高度的问题。动态高度在Firefox浏览器中有效，但在Chrome中无效。请参阅以下小工具XML以供参考我正在使用<Require feature="dynamic-height"/>和gadgets.window.adjustHeight();并尝试使用scrolling="true"。在谷歌浏览器中没有任何工作可用，Firefox正在按预期工作。

任何人都可以帮我解决这个问题吗？

<?xml version="1.0" encoding="UTF-8" ?>
<Module>
     <ModulePrefs title="() Group Membership Gadget" height="200" directory_title="() Group Membership Gadget" 
    description="Lists all groups associated to current user and users associated to each group." author=" " scrolling="true">
        <Optional feature="gadget-directory">
            <Param name="categories">
                JIRA
            </Param>
        </Optional>
        <Optional feature="atlassian.util" />
        <Optional feature="auth-refresh" />
        <Require feature="dynamic-height"/> 
        <Require feature="views" />
        <Require feature="settitle"/>
        <Require feature="oauthpopup" />
        #oauth
        <Locale messages="__ATLASSIAN_BASE_URL__/download/resources/-group-membership-gadget/i18n/ALL_ALL.xml"/>
    </ModulePrefs>
    <Content type="html" view="profile,canvas,home">
        <![CDATA[
        #requireResource("com.atlassian.jira.gadgets:common")
        #requireResource("com.atlassian.gadgets.publisher:ajs-gadgets")
        #requireResource("confluence.web.resources:jquery")
        #includeResources()

     <style type="text/css">
        .collapsibleList li > input + * {
         display: none;
        }

        .collapsibleList li > input:checked + * {
         display: block;
        }

        .collapsibleList label {
         cursor: pointer;
        }


        h1 {
         margin-left: 20px;
         font-size: 14px;
        }
   </style>

    <h1>Assigned Groups</h1>
    <br>
    <script type="text/javascript">

        (function () {
            var gadget = AJS.Gadget({
                baseUrl: "__ATLASSIAN_BASE_URL__",
                useOauth: "/rest/gadget/1.0/currentUser",
                view: {

                    onResizeAdjustHeight: true,
                    template: function(args) {
                         var gadget = this;

                        var userList = AJS.$("<ul/>").attr(
                            {
                                class: "collapsibleList"
                            }
                        );
                        AJS.$(args.userMembershipData.groups).each(
                            function() {
                                var group = this;
                                userList.append(
                                    AJS.$("<li/>").append(
                                        AJS.$("<label/>").attr(
                                            {
                                                for: group
                                            }
                                        ).text(group)
                                    ).append(
                                        AJS.$("<input/>").attr(
                                            {
                                                type: "checkbox",
                                                id: group,
                                                onchange: "javascript:gadgets.window.adjustHeight();", 
                                                style: "display:none;"
                                            }
                                        )
                                    ).append(
                                        function() {
                                            var unorderedList = AJS.$("<ul/>").attr(
                                            {
                                                onchange: "javascript:gadgets.window.adjustHeight();", 
                                            }
                                            );

                                            AJS.$(args.usersData).each(
                                                function() {
                                                    user = this;
                                                    if (this.groupName == group) {
                                                        unorderedList.append(

                                                        ).text(user.userNames);
                                                        onchange: "javascript:gadgets.window.adjustHeight();"
                                                    }
                                                }
                                            );
                                            return unorderedList;
                                        }
                                    )
                                );
                            }
                        );
                        javascript:gadgets.window.adjustHeight();
                        gadget.getView().html(userList); 
                    },
                    args: [
                        {
                            key: "userMembershipData",
                            ajaxOptions: function() {
                                return {
                                    url: "/rest/groupmembership/1.0/userGroups.json"
                                };
                            }
                        },
                        {
                            key: "usersData",
                            ajaxOptions: function() {
                                return {
                                    url: "/rest/groupmembership/1.0/groupUsers.json"
                                };
                            }
                        }
                    ]
                }
            });
        })();
    </script>

    ]]>
</Content>

Answer 1

我在博客小工具上遇到了类似的问题，经过几天的研究，我通过在html标签中添加 style =＆＃34; overflow：hidden;＆＃34; 来解决它。虽然生成了html标签，但我使用了jquery。所以解决方案是：

$('html').attr('overflow','hidden');

atlassian小工具高度在Google Chrome浏览器中无效

1 个答案: