jQuery函数仅适用于20个按钮

时间:2014-08-17 15:44:15

标签: php jquery

我有一个php函数,它通过一些产品循环,并为每个产品添加一些jquery,以便能够在客户需要时显示更多信息。

我有一个隐藏的div和一些信息初始化,如果用户点击图像,我会使用jquery打开。该脚本仅适用于20种产品,然后停止工作

这是我的jquery

jQuery(function ($) {
$('.list-op-idol').mouseover(function () {
    var itemid = '#div2' + $(this).attr('target'); //id of the element to show/hide.

    // this is already shown
    if($(itemid).hasClass('aktiv2')) return;

    $('.aktiv2').fadeOut("slow").removeClass('aktiv2');
    $(itemid).fadeIn("slow").addClass('aktiv2');
});

$('.list-op-idol').mouseleave(function () {
    var itemid = '#div2' + $(this).attr('target'); //id of the element to show/hide.

    $('.aktiv2').fadeOut("slow").removeClass('aktiv2');

}); 

$('.list-op-idol').click(function () {
    var itemid = '#div' + $(this).attr('target'); //id of the element to show/hide.

    // this is already shown
    if($(itemid).hasClass('aktiv')) return;

    $('.aktiv').fadeToggle("slow").removeClass('aktiv');
    $(itemid).fadeToggle("slow").addClass('aktiv');
});


$('.idolClose').click(function () {
    var itemid = '#div' + $(this).attr('target'); //id of the element to show/hide.

    $('.aktiv').fadeToggle("slow").removeClass('aktiv');

})



$('.idolClose').click(function () {
    var itemid = '#div' + $(this).attr('target'); //id of the element to show/hide.

    $('#mypopup').fadeOut("slow");

})

});

这是我的php

<?php foreach ($_productCollection as $_product): ?>

<div class="item-container-grid<?php echo ($i%4 == 0) ? " last" : "" ?>" target="<?php echo $idol2 ?>" id="itemIdol">

    <div class="product-image" onClick="getVoteInfo('<?php echo Mage::getBaseUrl();?>boxnetintegration/stockinfo/getvote/', '<?php echo $_product->getId();?>' )"; name="city" id="city">

    <div class="list-op-idol" target="<?php echo $idol ?>">

        <img id="<?php echo $idol ?>" src="<?php echo $this->helper('catalog/image')->init($_product, 'small_image')->backgroundColor(255,255,255)->resize(235, 235); ?>" width="235" height="235" alt="<?php echo $this->htmlEscape($this->getImageLabel($_product, 'small_image')) ?>" title="<?php echo $this->htmlEscape($this->getImageLabel($_product, 'small_image')) ?>"  />

        <div id="div2<?php echo $idol ?>" class="idolMouseover" target="<?php echo $idol ?>" style="display:none">

            <img src="<?php echo Mage::getBaseUrl();?>/skin/frontend/pro/idol/images/idol/mouseOver.png" alt="Rösta" />

        </div>

    </div>

    </div>
</div>

    <div id="div<?php echo $idol ?>" class="idol-wrapper" style="display:none">
        <div class="targetDiv">
        <div class="idolClose"><img src="<?php echo Mage::getBaseUrl();?>/skin/frontend/pro/idol/images/idol/close.png" alt="Stäng" /></div>
        <div class="popupImage">
            <img src="<?php echo $this->helper('catalog/image')->init($_product, 'small_image')->backgroundColor(255,255,255)->resize(200, 200); ?>" width="200" height="200" alt="<?php echo $this->htmlEscape($this->getImageLabel($_product, 'small_image')) ?>" title="<?php echo $this->htmlEscape($this->getImageLabel($_product, 'small_image')) ?>"  />
        </div>
        <div class="delaPaFacebook"">
            <img id="share_button<?php echo $idol ?>" src="<?php echo Mage::getBaseUrl();?>/skin/frontend/pro/idol/images/idol/dela-pa-facebook.png" alt="Dela på facebook" />
            </div>
        </div>
    </div>

    <script type="text/javascript">
        jQuery(document).ready(function($){
            $('#share_button'+<?php echo $idol ?>).live('click', function(e){
                e.preventDefault();
                FB.ui(
                    {
                        method: 'feed',
                        name: 'Jag tycker att <?php echo $_product->getName(); ?> är Sveriges bästa lösgodis.',
                        link: 'http://www.hemmakvall.se/idol.html',
                        picture: '<?php echo $this->helper('catalog/image')->init($_product, 'small_image'); ?>',
                        caption: 'Vad tycker du ?',
                        description: '.',
                        message: ''
                    });
            });
        });
    </script>
        <?php $idol++;?>
        <?php $idol2++;?>
        <?php $i++;?>
        <?php $j++;?>
        <?php $k++;?>
        <?php
        if($i > 4):
            $i = 1;
        endif;
        ?>
    <?php endforeach ?>

1 个答案:

答案 0 :(得分:0)

解决方案很简单:-) 我将计数器更改为$ idol = 25和$ idol2 = 75 它工作了