0

不确定是否有人可以帮助我，但我有一个产品查看页面，在顶部我有一个 h1 标签中的产品名称。

每个产品都附有一系列图像，这些图像以标签为颜色，即背面、象牙色、酒红色等。

我希望产品名称显示如下：

产品名称 | 颜色

我已经设法让它发生在第一个（默认）图像上。

因此，当您转到产品页面时，名称为：

奥尔巴尼 | 黑色（正是我想要的）

我现在希望当您单击产品名称的不同颜色选项（即图像）时更改为：

奥尔巴尼 | 象牙奥尔巴尼 | 勃艮第奥尔巴尼 | 巧克力等等等等。

我得到了一定的帮助，但现在我被困住了。

有人建议我更改主题的 script.js 文件以包含以下内容：

$('.more-views a').click(function(){
$('#label').text( $('img', this).attr('alt')  ); });

我的 h1 标签周围的代码如下：

<div class="product-name">
            <h1><?php echo $_helper->productAttribute($_product, $_product->getName(), 'name') ?>
            <span id="label"><?php echo ' | ' ?><?php echo $_product->getData('image_label');?></span></h1>
         </div>

如果有人知道如何实现这一点，我将不胜感激。

提前致谢。

有问题的页面的链接在这里：

http://dansiop.com/yarwood/index.php/albany.html

4

2 回答 2

1

您已经在页面中加载了几个 Javascript 库（包括 scriptaculous、prototype 和 jQuery）。看到你没有使用jQuery.noConflict()，你将不得不使用jQuery而不是$如果你设置使用 jQuery。

此外，您已经加载了 jQuery 1.7+，所以我建议您使用委托来处理这个问题。

// don't forget document ready
jQuery(function ($) {

    // let's cache the label
    var _label = $('#label');

    $('.more-views').on('click', 'a img', function () {
        _label.text($(this).attr('alt'));
    });

});

如前所述，您必须alt在图像中添加一个属性才能使其正常工作。alt如果没有什么可开始的，那么获取价值并显示它没有多大意义。

<img src="" alt="Blue" />
于 2012-06-18T10:56:23.323 回答
0 
$('.more-views a').click(function(){
   $('#label').text( $(this).find('img').attr('alt') );
});

请在此答案之前查看我的评论。

于 2012-06-18T10:47:26.810 回答