0

我试图停止我的 autoBike(); 如果我的#bike-main-slider div.bikedata-bike 属性值不存在，则自行车功能将运行。

<script>

    var bike = '<?=(isset($_REQUEST['bike']) ? htmlentities($_REQUEST['bike']) : null)?>';

    autoBike = function () {

         var bikeIndex = $('#bike-main-slider div.bike[data-bike=' + bike + ']').index();

         mainSlider.goToSlide(bikeIndex);  

    };

    autoBike();

</script>

<div id="slideshow">

     <div class="bike" data-bike="50cc"></div>
     <div class="bike" data-bike="100cc"></div>
     <div class="bike" data-bike="150cc"></div>
     <div class="bike" data-bike="200cc"></div>
     <div class="bike" data-bike="250cc"></div>
     <div class="bike" data-bike="350cc"></div>

</div>


这可能吗？

例如，如果我的网址是...

http://example.com/?bike=450cc

如您所见，我的#slideshow div 中不存在 450cc，那么autoBike();如果 data-bike 属性值不存在，是否有办法阻止我的函数运行？

使用 jQuery


谢谢

4

3 回答 3

2

您可以检查调用选择器时返回的对象的长度，如果为零，则只需从函数中返回您所做的第一件事。

var autobike = function () {

   var elms = $('#bike-main-slider div.bike[data-bike=' + bike + ']');
   if (elms.length === 0)
       return;

   // Do your stuff here, at least one element matched.
}

这是上面代码的一个工作示例：http: //jsfiddle.net/Gp5Xw/

长度属性与 jQuery 的 .size()

由于使用选择器调用 jQuery 函数将返回一个数组，因此该数组将具有您可以读取的长度属性，就像任何其他 JavaScript 数组一样。使用 jQuery 的.size()方法将产生与读取长度属性相同的结果，但它需要额外的函数调用，这是完全没有必要的。确实使用长度属性是一种微优化，但仍然如此。

来自 jQuery 文档.size()：

.size() 方法在功能上等同于 .length 属性；但是，首选 .length 属性，因为它没有函数调用的开销。

于 2012-11-22T13:15:45.540 回答
1 
autoBike = function () {
     var $bike = $('#bike-main-slider div.bike[data-bike=' + bike + ']');
     if($bike.size() > 0) {
          var bikeIndex = $bike.index();
          mainSlider.goToSlide(bikeIndex); 
     }
};
于 2012-11-22T13:18:44.197 回答
1

这应该工作...

$(document).ready(function() {

var bike = '<?=(isset($_REQUEST['bike']) ? htmlentities($_REQUEST['bike']) : null)?>';

$('bike').each(function() {
 if ($(this).attr('data-bike') === bike) {
     autoBike();
 }
});

});

autoBike() 仅当您的自行车 URL 参数作为数据自行车属性存在时才会运行...

于 2012-11-22T13:22:26.437 回答