顯示隨機div onclick

我在做一個小項目。對於這個項目，我希望能夠向我的網站的訪問者展示div。但是，我希望我的內容有所不同。我創建了三個div，全部使用不同的id。當有人進入我的網站時，我希望他/她只看到三個div中的一個。我創建了一些我認爲可以實現的代碼，但顯然它沒有。如果有人能告訴我我做錯了什麼，我會很感激。顯示隨機div onclick

HTML

<div id="one"> 
1 
</div> 

<div id="two"> 
2 
</div> 

<div id="three"> 
3 
</div> 

<input type="button" id="Button" value="Random" onclick="RandomDiv();" />

CSS

#one { 
    display:none; 
} 

#two { 
    display:none; 
} 

#three { 
    display:none; 
}

JAVASCRIPT

function RandomDiv() { 
    var myarray= new Array("one","two","three"); 
    var ChosenDiv = myarray[Math.floor(Math.random() * myarray.length)]; 
    alert(ChosenDiv); //Just to show this. 
    document.getElementbyId(ChosenDiv).style.display="inline-block"; 
}

現在，警報似乎工作鰭片e，這意味着在決定「ChosenDiv」（一，二或三）時沒有問題。但是，當我想讓所選的div可見時（display:none - >display:inline-block），它根本就不會這樣做。我試圖使用Google Chrome來定義問題，但我無法分辨問題所在。

來源

2017-04-16 Syan

爲什麼答案總是如此過於複雜？

只需運行代碼，檢查您的控制檯，並確定您使用的是getElementbyId而不是getElementById，並且其首字母爲b，這是基本的問題解決方案？

TypeError: document.getElementbyId is not a function[Learn More] script.js:6:5

jQuery是辦法不多投入到項目中簡單地編輯一些CSS或選擇一些簡單的元素，如果你問我。

來源

2017-04-16 00:48:13

謝謝！一定很愚蠢，看不到這一點。我看到它確實說了，但不知道這個問題。再次感謝。 – Syan

使用jQuery可以幫助改變JavaScript中的CSS。

有關如何使用此功能的更多信息，請參閱http://api.jquery.com/css/。

function RandomDiv() { 
    var myarray= new Array("one","two","three"); 
    var ChosenDiv = myarray[Math.floor(Math.random() * myarray.length)]; 
    alert(ChosenDiv); //Just to show this. 
    document.getElementById(ChosenDiv).css("display":"inline-block"); 
}

不要忘記在你的代碼中包含jQuery！

<script 
    src="https://code.jquery.com/jquery-3.2.1.min.js" 
    integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4=" 
    crossorigin="anonymous"></script>

來源

2017-04-16 00:45:24

這段代碼是否會運行，或者它應該包含類似於'（沒有JQuery）？ –

我不確定Syan如何使用這個應用程序。我剛從上面編輯他的代碼。要運行此代碼，您需要將代碼移出某個函數或將其從一個按鈕或鏈接中觸發。 –

你可以你的數組中值轉換爲這種格式：

var myarray= new Array("#one","#two","#three");

來源

2017-04-16 00:45:49 Osama

，這將使它通過「#one」的id獲得元素。他正在做正確的那部分 –

只需使用一個新的函數調用顯示，在與您的隨機化結塊是一個辦法讓錯誤的整個混亂，並且如前面提到的，看來你需要檢查你的資本，這一點很重要

來源

2017-04-16 01:16:12 Provision

顯示隨機div onclick

回答

相關問題