Jquery -在document.ready()上创建实例后更改对象属性 - jquery - changing object attribute after creating instance on document.ready()

jquery - changing object attribute after creating instance on document.ready()

我正在使用bxSlider插件(一个类似于jcarousel的滑块)在自定义Magento商店。

当滑块被定位在document .ready()(在header html部分)上时:

jQuery('#slider2').bxSlider({
    pause: 4000,
    auto: true,
    autoControls: true,
    displaySlideQty: 4,
    moveSlideQty: 1
});

我想改变自动属性为false在php代码中，如果滑块项目计数小于5。我试着用:

来改变它

<?php
    // slider items count
    $prom_count = $this->getPromotionalProducts()->count();;
?>
<?php if($prom_count<5): ?>
    <script>
        $("#slider2").attr('auto','false');    
    </script>
<?php endif; ?>

，但它不起作用，所以我不确定对象的属性在dom上实例化就绪可以通过这种方式改变。有人能帮忙吗?

jquery库中的attr -方法处理html元素的属性:

<img src="..." alt="...">

在本例中，src和alt是"属性"。

通过给bxSlider -函数一个数组来配置bxSlider。当数组被传递给函数后，你不能修改它。

你可以做什么来切换自动显示是使用bxSlider的stopShow() -功能。要做到这一点，您可能需要保存您创建的bxslider实例:

var slider = jQuery('#slider2').bxSlider({
   ...
});

所以你可以调用这个对象上的函数:

slider.stopShow();

以混合的方式使用PHP和JavaScript(像你建议的那样)是丑陋的，应该避免。

相反，你应该使用纯javascript解决方案:

var slider = jQuery('#slider2').bxSlider({
   auto: true,
   ...
});
if (slider.getSlideCount() < 5){
  slider.stopShow();
}

请注意，getSlideCount()返回幻灯片的数量，它不能保证是图库中图像的数量!一次显示的幻灯片数量可以通过displaySlideQty -属性来设置。但是默认值是1。

似乎有一个Bug导致startShow和stopShow -函数不工作:https://github.com/wandoledzep/bxslider/pull/43

作为一种肮脏的解决方案，您可以这样做:

<?php
    echo "<script type='"text/javascript'">
        jQuery('#slider2').bxSlider({
            pause: 4000,
            autoControls: true,
            displaySlideQty: 4,";
    if($prom_count >= 5) echo "auto: true,";
    echo "moveSlideQty: 1
        });
    </script>";
?>

看起来没有API函数。如果使用reloadShow()，可能会再次加载配置。如果没有帮助，你必须阅读源代码

这将设置元素本身的auto属性，而不是插件的自动选项。它看起来不像插件有能力在你实例化它之后改变选项，尽管我只是快速地看了一眼。

你可以不设置正确的auto值，当你运行插件，把php代码第一?