Question

对于问题中的错误措辞感到抱歉，但对我来说很难解释。我在页面上使用了几个bxsliders，有些则放在隐藏的div中。不幸的是，除非重新加载滑块，否则在使父div可见后，滑块中不会显示图像（请参阅此处：bxSlider within show/hide divs）。所以，让我们说我在开头用以下方式启动滑块：

var slider_0=$("#slider_0 .bxslider").bxSlider({
    //bxslider options here
});

var slider_4=$("#slider_4 .bxslider").bxSlider({
    //bxslider options here
});

var slider_7=$("#slider_7 .bxslider").bxSlider({
    //bxslider options here
});

滑块没有连续编号，但有一个导航，如果我点击第7个元素，它会导致slider_7。所以我可以通过以下方式获取被点击项目的索引：

$(this).index();

当我致电slider_7.reloadSlider();时，它会起作用，但我不知道用户点击了哪个滑块以及它有哪个号码。那么可以用这样的创建字符串调用它：

slider_name='slider_'+$(this).index();
slider_name.reloadSlider();

当然不起作用。有办法吗？

Answer 1

我会创建一个字典，其中字符串作为键，函数作为值。然后，您可以O（1）查找您要定位的功能。

一般来说，你可以这样做：

// set up your dictionary
var dictionary = {};

// add your functions
dictionary['methodName'] = function() {};

// call the functions
dictionary['methodName']();

因此，对于您的示例，您可以这样做：

dictionary['slider_7'] = slider_7.reloadSlider;

dictionary['slider_'+$(this).index()]();

Answer 2

您可以使用

触发它

window["slider_" + $(this).index()].reloadSlider()

虽然，我不确定你的方法是否最好。我想我会使用数组或对象（作为键值对）

Answer 3

试试这个：

slider_name='slider_'+$(this).index();
$("#" + slider_name + " .bx_slider").reloadSlider();

Answer 4

这里并不完全清楚你想要/想要做什么。您想要做的似乎是当用户单击页面的特定部分时，在特定滑块上获得编程句柄。你没有通过eval()字符串来实现这一点......这就是事件处理程序的用途。因此，在该事件处理程序中创建一个单击事件处理程序

$('#idOfWhatTheUserClicksOn').click(function(event) {
    var slider = document.getElementById('#idOfRelatedSlider');
    $(slider).bxSlider();
    //if you need the current value of the slider you can get that too
    var value = slider.value;
});

通过使用类而不是使用不同处理程序的id，您可以用更少的LOC实现相同的功能，但概念是相同的。

Answer 5

找到了一个有效的解决方案：

eval("slider_" + $(this).index()).reloadSlider();

Answer 6

var slider_cache = [
    $("#slider_0 .bxslider").bxSlider(),
    $("#slider_1 .bxslider").bxSlider(),
    $("#slider_2 .bxslider").bxSlider()
];

...

slider_cache[$(this).index()].reloadSlider();

如何创建一个字符串并使用以它命名的函数？

6 个答案: