0

我是 javascript 的新手，想调整以下 jquerymobile 代码以允许使用它，而无需在 data-role="popup" div 中硬编码图像路径。

这是代码的两个部分。第一部分用于显示缩略图，当触摸该缩略图时，会显示具有更高分辨率图片的灯箱：

<a href="#popupPhoto" data-rel="popup" data-position-to="window" data-inline="true" data-transition="fade" ><img  class="v100col" alt="equinox" src="images/equinox.jpg"></a>

触摸图片执行以下操作以显示弹出窗口：

</div>
<div data-role="popup" id="popupPhoto" data-overlay-theme="a" data-theme="a" data-corners="false">
<a href="#" data-rel="back" data-role="button" data-theme="a" data-icon="delete" data-iconpos="notext" class="ui-btn-right">Close</a><img class="popphoto" rc="images/equinox_big.jpg" alt="Equinox">
</div>

我想用一个变量替换 src="images/equinox_big.jpg" 以便可以对我的移动页面上的所有图像执行相同的 div 例程。

在显示图像之前，执行以下 on-event 函数

$( ".photopopup" ).on({
popupbeforeposition: function() {
var maxHeight = $( window ).height() - 60 + "px";
$( ".photopopup img" ).css( "max-height", maxHeight );
}
});

这可以通过修改popupbeforeposition js函数或其他方法来完成吗？

谢谢艾略特``

4

1 回答 1

1

正因为我是更多的服务器端开发人员，所以我会使用 mysql 进行数据库查询并使用 php.ini 检索图像名称。

就像是：

<?php 
$query = "SELECT * FROM mytable";
$result = mysql_query($query) or die (mysql_error());
while ($row = mysql_fetch_assoc($result)) {
    $img = $row['img_name'];
    echo '<img src="'.$img.'"/>';
}
?>

如果您想管理大量图像并将它们很好地组织在数据库中，我认为这可能是最好的解决方案。

于 2012-10-08T13:24:17.600 回答