1

我整理了一个简单的例子：

我有一个缩略图列表，我想在选择列表中的图像时显示更大的图像：

@if (Model.GalleryIcon.Any())
{
    foreach (var cell in Model.GalleryIcon)
    {  
        <a href="/Logo/MobileImage?url=@cell.TargetImagePath" data-rel="dialog" data-transition="pop" ><img src="@cell.ThumbInvPath" /></a>        
    }    
}

/Logo/MobileImage?url=@cell.TargetImagePath返回一个局部视图，其中 @Model 是一个 imagePath 字符串：

@model string

<div id="logo-image-wrap">
      <img src='@Model' id="logo-wrap-mobile-image"/>
      <br />
      <a href="#" data-role="button" data-rel="back" data-icon="arrow-l">Back</a>
 </div>

这个工作是我在锚上设置 rel="external" 并简单地在新的单独页面中打开一个图像，但它不能作为一个对话框工作。从列表中选择缩略图图像时，会出现一个空白对话框，并显示“未定义”

当从列表中选择缩略图时，如何在对话框中使用图像详细信息来显示我的部分视图加载？

谢谢你。

4

3 回答 3

2

编辑三：

我向任何试图利用我的答案的人道歉。我不知何故错过了问题的整个“移动”部分，所以我在这里的例子+解释完全无关紧要。如果您想查看以前编辑的代码和其他内容，请单击答案下方的“已编辑”链接。

在与 OP 讨论了这个问题之后，我们认为这样的事情可能会起作用（但需要在我们知道之前进行测试）：

修改生成的锚点，为我们的 jQuery 绑定添加一个钩子：

<ul>
...
    <li><a class="btn" href="someurl">Art</a></li>
...
</ul>

然后，我们需要为这些链接的点击事件添加一个处理程序：

$('a.btn').on('click', function(event){
    event.preventDefault();
    var href = $(this).attr('href');
    $.mobile.changePage( href, { role: 'dialog', transition: 'slide' } );
});

这应该做什么它向我们想要显示的页面发出请求，该页面被 jQuery Mobile 框架劫持。第二个参数告诉框架将页面显示为对话框，而不是“导航”到它。

于 2012-08-07T06:54:39.293 回答
1

我认为您可能会尝试通过 onclick 事件而不是动态 dom 加载的内联语句来调用对话框。通过这种方式，您可能有机会加载创建的 dom 元素，而不是正在处理的元素。在 onclick 事件中，您还可以在发送到对话框之前通过 .load 刷新 dom。

于 2012-08-07T07:01:18.133 回答
0

详细解决办法贴在这里：

http://usnitch.blogspot.com/2012/08/jquery-mobile-how-to-dynamically-load.html

于 2012-08-13T18:45:03.343 回答