0

我正在尝试实现拖放功能。在左侧窗格中，我将拥有可以被视为图像的图块。在右侧窗格中，我将拥有 iframe。我想从左窗格中拖动图块并将它们放到右窗格上的 iframe 中。唯一的问题是我想将每个图像/图块与网页（在同一个域中）相关联，这样在放置时，关联的网页会填充到 iframe 中。

关于 jquery 拖放如何工作以及 HTML 5 拖放如何工作的大量文档。但是我不知道如何将图像映射到可以在放置事件时填充的网页。

我能想到的一件可能的事情是存储图像及其具有相同名称的相应网页。也就是说，如果我有一个图像 xyz.jpg，我会将其对应的网页命名为 xyz.html。所以在drop事件的时候，我会从“xyz.jpg”中去掉“xyz”并将“.html”附加到它上面。所以结果是 xyz.html，我将使用 jquery 将其放入 iframe 的“src”字段中。

这是解决问题的好方法还是有更好的方法来解决这个问题，这样我就没有图像和网页同名的限制？非常感谢您对此的任何帮助。

4

1 回答 1

1

只需使用数据标签。例如：

<img src="blah.jpg" data-url="http://google.com/" />

然后（假设 jquery），您可以像这样访问它们：

$(image).attr('data-url');

或者

$(image).data('url');

jsFiddle：http: //jsfiddle.net/jQKV4/

于 2012-07-03T07:35:43.597 回答