如何在与 jQuery mobile 的对话中显示图像？答案

【问题标题】：How can I show a image in a dialogue with jQuery mobile?如何在与 jQuery mobile 的对话中显示图像？
【发布时间】：2012-07-30 12:05:13
【问题描述】：

我尝试过使用几个插件：code.photoswipe-3.0.4、NETEYE-touch-gallery-1.0.0，这两个插件的使用说明都不完整，或者根本不起作用。

是因为我使用的是 jquery/jquery 移动版本吗？它的 1.6.4/1.0.1

按照说明进行操作，当我单击链接时，我会看到一个带有“未定义”的新页面。一直无法解决问题。任何帮助将不胜感激。

当我使用 photoswipe 时，这就是我所做的

我按照 photoswipe 网站上的说明将其放在标题上：

$(document).ready(function(){

var myPhotoSwipe = $("#Gallery a").photoSwipe({ enableMouseWheel: false , enableKeyboard: false });

});

这个在画廊 div 中（有 data-role="controlgroup"）：

<ul id="Gallery">
<li>
<a href="../images/course_img/1_full.jpg"> <!--adding the rel=external simply opens the image in a new website page.>
<img src="../images/course_img/1_thumb.png"</a>
</li>
</ul>

我得到的只是未定义的错误，或损坏的链接或显示在单独网页中的图像。

现在我放弃了整个额外的脚本方法，并采用了更愚蠢和简单的方法。令我惊讶的是，这也行不通！

      <a href="../images/course_img/1_full.jpg" data-rel="dialog">
        <img src="../images/course_img/1_thumb.png"/>
      </a>

你能帮我一个指针或 2 吗？非常感激！我正在使用最新的 x64 系统上的 dreamweaver cs6 和 chrome。我在页面上运行了几次链接检查器，链接都很好，除非我遗漏了什么！

在 javascript 控制台中，当我按下上面的链接时，这是我得到的：

XMLHttpRequest 无法加载 file:///E:/GoogleCloud/Google%20Drive/git/TestApp/images/course_img/1_full.jpg。 Access-Control-Allow-Origin 不允许 Origin null。

【问题讨论】：

标签： jquery ajax jquery-plugins jquery-mobile

【解决方案1】：

经过一番挖掘，看起来出于某种愚蠢的原因，您无法在 dw 中使用 jpeg。它们显示为断开的链接或文件丢失。例如：

如果你这样做

<a href="blabla.jpeg">
  <img src="blublu.png"/>
</a>

链接将无法正确显示。两个图像必须具有相同的格式。愚蠢，但真实。我发现的另一件事是在 photoswipe 网站上实现代码后我仍然得到一个

Uncaught TypeError: undefined is not a function

【讨论】：