如何使特定的輸入觸發某些東西？

Question

我正在嘗試創建一個函數來檢查一個人何時輸入了 0 和 8 中的數字，然后發生了與該數字相對應的事情。 例如，用戶輸入 5，這使得圖片和文字出現，如果人輸入 3，則會出現不同的圖片和文字等。

到目前為止，我有一個論壇，人們可以在其中輸入一個數字，但我一直試圖弄清楚如何使這些輸入觸發顯示圖片和文本的動作。

<div id="Jupiter">
                <div class="pictures" >
                    <img src="img/Jupiter.gif">
                </div>
                    <h1 class="title">Jupiter</h1>
                    <div class="paragraphs"><p> Jupiter is the fifth planet from the Sun and the largest in the Solar System. It is a giant planet with a mass one-thousandth that of the Sun, but two-and-a-half times that of all the other planets in the Solar System combined. Jupiter and Saturn are gas giants; the other two giant planets, Uranus and Neptune, are ice giants. Jupiter has been known to astronomers since antiquity.[17] It is named after the Roman god Jupiter.[18] When viewed from Earth, Jupiter can reach an apparent magnitude of −2.94, bright enough for its reflected light to cast shadows,[19] and making it on average the third-brightest natural object in the night sky after the Moon and Venus. <br><br>Jupiter is primarily composed of hydrogen with a quarter of its mass being helium, though helium comprises only about a tenth of the number of molecules. It may also have a rocky core of heavier elements,[20] but like the other giant planets, Jupiter lacks a well-defined solid surface. Because of its rapid rotation, the planet's shape is that of an oblate spheroid (it has a slight but noticeable bulge around the equator). The outer atmosphere is visibly segregated into several bands at different latitudes, resulting in turbulence and storms along their interacting boundaries. A prominent result is the Great Red Spot, a giant storm that is known to have existed since at least the 17th century when it was first seen by telescope. Surrounding Jupiter is a faint planetary ring system and a powerful magnetosphere. Jupiter has 79 known moons,[21] including the four large Galilean moons discovered by Galileo Galilei in 1610. Ganymede, the largest of these, has a diameter greater than that of the planet Mercury.<br><br>Jupiter has been explored on several occasions by robotic spacecraft, most notably during the early Pioneer and Voyager flyby missions and later by the Galileo orbiter. In late February 2007, Jupiter was visited by the New Horizons probe, which used Jupiter's gravity to increase its speed and bend its trajectory en route to Pluto. The latest probe to visit the planet is Juno, which entered into orbit around Jupiter on July 4, 2016.[22][23] Future targets for exploration in the Jupiter system include the probable ice-covered liquid ocean of its moon Europa.</p>
                </div>
        </div>

所以我希望它在一個人輸入數字“5”時顯示這個

這是我的論壇

<fieldset>
            <legend>Enter a Number between 0 and 9</legend>
            <p>Number: <input type="text" id="inputNumber" placeholder="Number" required></p>
            <p><input type="submit" value="Enter" id="submit" /></p>
        </fieldset>

這是腳本

function displayPlanet(){
        var data = getElementbyId("submit").innerHTML;
        if(data == 5){

        }
    }

我明白如何獲得讓我感到困惑的功能是我究竟如何制作 div id Jupiter 顯示。 那是我最初的問題，抱歉造成誤解。

Answer 1

您可以從輸入框中收聽keyup 事件。

 function onKeyUp(e) { if (parseInt(e.value) == 5) { // do something here } }

 <input type="text" onkeyup="onKeyUp(this)">

Answer 2

你需要使用 DOM

 function action() { var data = document.getElementById("result").innerHTML; //Get the data if (data == 1) { alert("1"); } }

 <input id="result" type="text" onkeyup="action()">