0

我为一个必须为学校做的项目编写了一个 javascript 代码。我的想法是通过单击按钮在屏幕上显示随机香蕉。所以我写了这段代码..但它不起作用！

<script>

function bananenapokalypse() {
    var t=10.20;
    var myVar=setInterval(function(){myTimer()},200);
}
function myTimer()
{
    var zufall=Math.floor(Math.random() * 1100) + 1;
    var zufall2=Math.floor(Math.random() * 1000) + 1;
    var zufall3=Math.floor(Math.random() * 1250) + 1;
    var zufall4=Math.floor(Math.random() * 900) + 1;

    var grose  =Math.floor(Math.random() * 200) + 1;
    var grose2 =Math.floor(Math.random() * 300) + 1;
    var grose3 =Math.floor(Math.random() * 200) + 1;

    document.getElementById("demo").innerHTML+= '<div class="bananenapokalypse" style="top: '+zufall+';right: '+ zufall2+ ';"><img src="./bilder/banane.png" width="'+ grose +'"/></div>';
    document.getElementById("bananenapokalypse").innerHTML+='<div class="bananenapokalypse" style="top: '+zufall2+';right: '+ zufall3+ ';"><img src="./bilder/banane.png" width="'+ grose2 +'"/></div>';
    document.getElementById("bananenapokalypse").innerHTML+= '<div class="bananenapokalypse" style="top: '+zufall3+';right: '+ zufall4+ ';"><img src="./bilder/banane.png" width="'+ grose3 +'"/></div>';
    document.getElementById("bananenapokalypse").innerHTML+='<div class="bananenapokalypse" style="top: '+zufall4+';right: '+ zufall+ ';"><img src="./bilder/banane.png" width="'+ grose +'"/></div>';

}

</script>   
</head>
<body id="bananenapokalypse">

<p id="demo"><a href="javascript:bananenapokalypse()"><button><span class="energie">Energie?</span><br /><br />[Starte die Bananenapokalypse]</button></a></p>

我也知道代码排列不整齐......但它是针对学校的，主题是关于 HTML 而不是 javascript。

你知道为什么它不工作吗？

4

2 回答 2

1

像这样使用 onclick 事件：

<p id="demo"><button onclick="bananenapokalypse()"><span class="energie">Energie?</span><br /><br />[Starte die Bananenapokalypse]</button></a></p>
于 2013-04-07T07:33:21.573 回答
1

1）您的函数与主体 ID 具有相同的名称。

<a>2）标签使用方式不当

http://jsfiddle.net/UQTY2/47/

<div id="bananenapokalypse">
    <p id="demo">
        <button onclick="javascript:myFunctionbananenapokalypse();"><span class="energie">Energie?</span>
            <br />
            <br />[Starte die Bananenapokalypse]</button>
    </p>
</div>

<script>
function myFunctionbananenapokalypse() {
    var t = 10.20;
    var myVar = setInterval(function () {
        myTimer()
    }, 200);
}

function myTimer() {
    var zufall = Math.floor(Math.random() * 1100) + 1;
    var zufall2 = Math.floor(Math.random() * 1000) + 1;
    var zufall3 = Math.floor(Math.random() * 1250) + 1;
    var zufall4 = Math.floor(Math.random() * 900) + 1;

    var grose = Math.floor(Math.random() * 200) + 1;
    var grose2 = Math.floor(Math.random() * 300) + 1;
    var grose3 = Math.floor(Math.random() * 200) + 1;


    document.getElementById("demo").innerHTML += '<div class="bananenapokalypse" style="top: ' + zufall + ';right: ' + zufall2 + ';"><img src="./bilder/banane.png" width="' + grose + '"/></div>';
    document.getElementById("bananenapokalypse").innerHTML += '<div class="bananenapokalypse" style="top: ' + zufall2 + ';right: ' + zufall3 + ';"><img src="./bilder/banane.png" width="' + grose2 + '"/></div>';
    document.getElementById("bananenapokalypse").innerHTML += '<div class="bananenapokalypse" style="top: ' + zufall3 + ';right: ' + zufall4 + ';"><img src="./bilder/banane.png" width="' + grose3 + '"/></div>';
    document.getElementById("bananenapokalypse").innerHTML += '<div class="bananenapokalypse" style="top: ' + zufall4 + ';right: ' + zufall + ';"><img src="./bilder/banane.png" width="' + grose + '"/></div>';
}

<script>
于 2013-04-07T07:34:40.890 回答