Javascript and HTML mix(array selection)

时间:2016-07-11 20:25:21

标签: javascript html

Radio button

<div class="radio" >
   <input type="radio" name="round" > Round 1<br>
   <input type="radio" name="round" onclick="round2();" checked> Round 2<br>
   <input type="radio" name="round" value="r3"> Round 3 <br>
</div >

    <div class="app" >
        <h2>LootChest Generator</h2>
        <button type="submit" style="background-color:rgba(255,255,255,0.0); border:none;" id="resultButton" onclick="myFunction();"><img src="img/h.png" /></button>

<h1><p id="demo"></p></h1>
        <div id="deviceready" class="blink">
//javascript
function myFunction() { 
   //"Topaz", "Opal", "Moonstone", "Pearl", "Turquoise", "Garnet", "Onyx", "Alexandrite", "Agate"

    var Loot = ["Ruby", "Jade","Obsidian"];
    //Loot.push("topaz!","diamond!");
    var Hrandom = Loot[Math.floor(Loot.length * Math.random())];

        document.getElementById("demo").innerHTML =
        ""+Hrandom;

    function round2()
    {
       Loot.push("diamond!");
    }
}

-- have been trying this for hours/days and cant do it. I just want to display an array of 3-5 elements in an html, then add more if the radio 2 is selected, same with radio 3. Do I have to make an if condition? I tried to add the array push but dont know how to make it work. I read a lot in w3school but I just get confuse, to much infomation, poor brain.

2 个答案:

答案 0 :(得分:0)

It looks like you have a lot of JavaScript to learn, so it's kind of hard to point you in the right direction without more specific information. If you're looking to add content to the page dynamically, which it sounds like you are, then you may want to look into something like jQuery or Knockout JS. If you're not looking to add anything other than pure JavaScript, you may want to try adding onclick="yourfunction()" into the input tags for your radio buttons and then make yourfunction() the area where you add the other parts of the array. Look into arrays and the Document Object Model (DOM) to see how you can add content based on what you have in JavaScript. Hopefully some of this will help!

答案 1 :(得分:0)

To add something in JavaScript do this:

document.getElementById("demo").innerHTML += " " + Hrandom;

Note the plus sign before the equals. Otherwise you are replacing the old content with the new.