1

我有一个非常简单的功能，它应该根据单击的特定链接更改页面背景颜色，但我不知道为什么它不起作用。

这是我到目前为止的演示：http: //jsfiddle.net/cF74Y/

看来这一定是一个如此微不足道的错误，但我看不到。任何帮助将不胜感激。

4

6 回答 6

3

您将字符串与数字进行比较，更改switch (currentItem)为switch (+currentItem)将使您的演示工作。

另外：您可以将currentItem作为参数传递，而不是使用全局变量。

这是工作演示。

于 2012-10-04T06:37:20.037 回答
3

我觉得你把事情复杂化了，你不能这样做吗？

html:

<ul id="nav">
    <li><a class="color" href="#">red</a></li>
    <li><a class="color" href="#">green</a></li>
    <li><a class="color" href="#">blue</a></li>
    <li><a class="color" href="#">yellow</a></li>
</ul>

jQuery：

$('a.color').click(function(){
    $('body').css('background-color', $(this).text());
});

演示：http: //jsfiddle.net/elclanrs/8yev9/

编辑：如果您需要通过索引分配颜色使用数组，我认为您不需要那个丑陋的switch语句，对我来说似乎毫无用处，所有代码都可以简化为：

var colors = ['red', 'blue', 'green', 'yellow'];
$('a.color').click(function(){
    $('body').css('background-color', colors[$(this).parent().index()]);
});

演示：http: //jsfiddle.net/elclanrs/8yev9/1

于 2012-10-04T06:40:04.803 回答
2

试试这个：

var index = parseInt($(this).attr('id'),10);

那么它将起作用。

原因： .attr() 函数的返回类型是一个字符串，它总是使 case 1 为真。只需使用 parseInt 函数。

于 2012-10-04T06:40:34.960 回答
0

也许您必须在函数调用中提供参数“currentItem”。

changeBg(currentItem); // call

您的函数将如下所示：

function changeBg(currentItem) {
    var bg = 'null';
    switch (currentItem) {
        case 1 :
            bg = '#6A6A6A';
[..]
于 2012-10-04T06:34:47.993 回答
0

这是一个工作副本

http://jsfiddle.net/cF74Y/34/

于 2012-10-04T06:40:44.660 回答
0

用于parseInt与案例进行比较。与此无法比较。参见小提琴。 http://jsfiddle.net/cF74Y/43/

于 2012-10-04T06:45:00.310 回答