我有一个网站出售带框、裱装或印刷品的图片产品。我在带有产品缩略图的网格中显示产品。
选择选项的类是“cardid”,缩略图的类是“cardim”。我每页有 20 个产品。
客户可以使用选择菜单选择是否要将篮子添加到框架、安装或仅作为打印件。当他们从选择菜单中选择不同的选项时,我想更改缩略图。
我将如何使每个类都独一无二,我将如何在我的 script.js 中处理这个而不复制相同的代码?目前,如果我更改任何选择选项,所有图像都会更改。
脚本.js
// Event handler for picture selector
$('.cardid').change(function() {
$(".cardim").attr("src", "images/products/thumb/new-image.jpg");
});
这是缩略图的代码。
<a class="card_thumb" href="img/products/large/<?php echo $cims[0];?>" title="<?php echo $product['Products_SKU'];?>"><img src="img/products/thumb/<?php echo $cims[0];?>" class="cardim" alt="<?php echo $product['Products_SKU'];?>"></a>
还有一段代码用于选择
<option value="' . $row['Products_ID'] . '">'. $selector[$key] .'</option>