我正在尝试移植一个 jQuery 插件,我必须与 AngularJS JQlite API 兼容,但遇到了一些障碍。这是插件:
(function (e) {
var $product = $('#product'),
$imgs = $product.find('.child'),
imageTotal = $imgs.length - 1,
clicked = false,
widthStep = 4,
currPos,
currImg = 0,
lastImg = 0;
$imgs.bind('mousedown', function (e) {
e.preventDefault(); // prevent dragging images
})
.filter(':gt(0)').addClass('notseen');
$product.bind('mousedown touchstart', function (e) {
if (e.type == "touchstart") {
currPos = window.event.touches[0].pageX;
} else {
currPos = e.pageX;
}
clicked = true;
});
$(document)
.bind('mouseup touchend', function () {
clicked = false;
})
.bind('mousemove touchmove', function (e) {
fadeInOut();
if (clicked) {
var pageX;
if (e.type == "touchmove") {
pageX = window.event.targetTouches[0].pageX;
} else {
pageX = e.pageX;
}
widthStep = 4;
if (Math.abs(currPos - pageX) >= widthStep) {
if (currPos - pageX >= widthStep) {
currImg++;
if (currImg > imageTotal) {
currImg = 0;
}
} else {
currImg--;
if (currImg < 0) {
currImg = imageTotal;
}
}
currPos = pageX;
$imgs.eq(lastImg).addClass('notseen');
$imgs.eq(currImg).removeClass('notseen');
lastImg = currImg;
// $obj.html('<img src="' + aImages[options.currImg] + '" />');
}
}
});
});
它所做的只是创建 360 度旋转效果,可以演示 here 强>。
现在的问题是其中一些特定于 jquery 的 API。像 .filter(':gt(0)')
这样的东西选择索引大于 0 和 pageX 的数组中的项目。我对 .filter(':gt(0)')
做了一些研究和 came across a native javascript method of filtering但它似乎只过滤特定索引(索引 2、6、13,而不是 >0)。
关于如何以纯 javascript 格式实现此过滤器的任何想法?感谢您的帮助。
最佳答案
您可以使用 [].slice
来获取数组中大于 n 的所有索引,而不是使用过滤器。
$([].slice.call($imgs,1)).addClass("notseen");
这在 jquery 中也有效:
关于javascript - 如何实现sizzle的:gt filter in vanilla javascript,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22617667/