单击项目时显示浮出控件答案

【问题标题】：Show flyout on clicking an item单击项目时显示浮出控件
【发布时间】：2012-07-23 23:41:45
【问题描述】：

在 Metro 应用程序中，如何在用户单击 ListView 项的子元素时显示浮出控件。我的意思是当用户点击下面的 ListView 项目的“项目覆盖”时，应该显示一个弹出窗口。我遇到的问题是 Metro ListView 没有提供事件方法让我在 itemInvoked 中获取该 DOM。

HTML

<!-- Detail items -->
<div class="itemtemplate" data-win-control="WinJS.Binding.Template">
    <img class="item-image" src="#" data-win-bind="src: backgroundImage; alt: title" />
    <div class="item-overlay">
        <h4 class="item-title" data-win-bind="textContent: shortTitle; id: key"></h4>
    </div>
</div>

JS。这是 ListView 项的 itemInvoked 事件

itemInvoked: function (args) {
    console.log("groupItems:itemInvoked");
    if (appView.value === appViewState.snapped) {
        // If the page is snapped, the user invoked a group.
        var group = Data.groups.getAt(args.detail.itemIndex);
        nav.navigate("/pages/groupDetail/groupDetail.html", { groupKey: group.key });
    } else {
        // If the page is not snapped, the user invoked an item.
        var item = Data.items.getAt(args.detail.itemIndex);

        nav.navigate("/pages/itemDetail/itemDetail.html", { item: Data.getItemReference(item) });
    }
},

【问题讨论】：

标签： javascript windows-8 microsoft-metro

【解决方案1】：

您可能需要将 win-interactive 添加到容器中，以确保列表视图不会吞噬与元素的任何交互。

也就是说，考虑到你的处理程序，你为什么还要走这条路，默认调用的东西没有给你你需要的东西吗？

【讨论】：