随机口号发生器使用javascript的开关

时间:2013-03-29 18:32:45

标签: javascript

我没有什么问题。我正在学习javascript,我想使用switch为我的网站创建随机标语生成器。

所以我创建了这个HTML代码

<body onload="rndqu()">
    <div id="head"> <a href="index.html">Mira's place<a><br>
            <h2>&#8220;<span id="quote"></span>&#8221;</h2>
    </div>
</body>

并使用此Javascript

var qu;
var slogan;
function rndqu(n){
    var random = function(min, max) {
    return Math.floor(Math.random() * (max - min + 1)) + min;
    };  
    qu = random(1, 3);
}
switch(qu){
    case 1:
        slogan = "Here is the 1";
        break;
    case 2:
        slogan = "Here is the 2";
        break;
    case 3:
        slogan = "Woah";
        break;
    default:
        slogan = "Really?";
}
document.getElementById("quote").innerHTML = slogan;

我不明白为什么它不起作用。有人能帮我吗?谢谢!这里是jsfiddle http://jsfiddle.net/NX3cz/

3 个答案:

答案 0 :(得分:4)

我会为此使用数组而不是switch语句,以使其更灵活。例如:

var quotesList = ["I'm a great guy!", "Not even kidding.", "Just incredible."];

var randQuote = function(quotes) {
    var choice = Math.floor(Math.random() * quotes.length);
    return quotes[choice];
}

document.getElementById("quote").innerHTML = randQuote(quotesList);

这样,可以自由更改引用数组的大小,而无需更改任何代码。

演示:jsfiddle

答案 1 :(得分:2)

您将部分代码留在rndqu()函数之外。 我在这里分叉并纠正你的小提琴: http://jsfiddle.net/BwJ7s/

这是更正后的JS代码:

var qu;
var slogan;
function rndqu(n)
{
    var random = function(min, max) {
    return Math.floor(Math.random() * (max - min + 1)) + min;
    };  
    qu = random(1, 3);

    switch(qu){
        case 1:
            slogan = "Here is the 1";
            break;
        case 2:
            slogan = "Here is the 2";
            break;
        case 3:
            slogan = "Woah";
            break;
        default:
            slogan = "Really?";
    }
    document.getElementById("quote").innerHTML = slogan;
}

答案 2 :(得分:0)

此处已修复http://jsfiddle.net/NX3cz/13/

var qu;
var slogan;
function rndqu(min, max){

    qu =  Math.floor(Math.random() * (max - min + 1)) + min;

    switch(qu){
        case 1:
            slogan = "Here is the 1";
            break;
        case 2:
            slogan = "Here is the 2";
            break;
        case 3:
            slogan = "Woah";
            break;
        default:
            slogan = "Really?";
    }
    document.getElementById("quote").innerHTML = slogan;
}

rndqu(1, 3);

您的代码过于复杂也请注意,在jsfiddle中不添加body onload="()"函数。 Jsfiddle为你做到了。

如果你想在真正的网页上onbodyload将你的代码包装在其中:

window.onload = (function(){
    //your code goes here
})

或将您的脚本包含在html文件的底部。

只要有可能,最佳做法是避免使用HTML中的内联javascript。