1

ボタン (値が「次へ」のボタン) をクリックして、ページにあるコードの一部を新しいコードに置き換えるコードを探しています。これは私の現在のコードです。スコア カウンターの後のすべてを置き換える必要があります。ずさんなコードをお詫びします。私はこれにかなり慣れていません。

<body>
<p>Score: <span id="counter">0</span></p><br/>

<p>1) What colour is this?</p><br />

<p><img style= "margin: 0 auto;" src="colour1.png" width="70%"></p><br /><br />


<p><button id="none" onClick="showDiv01()">Almond White</button><br>
<button id="score" onClick="showDiv02(); this.disabled = 'true';">Raspberry Diva</button><br>
<button id="none" onClick="showDiv01()">Melon Sorbet</button><br>
<button id="none" onClick="showDiv01()">Gentle Lavender</button><br></p>


<div id="answer1" style="display:none;" class="wronganswer">&#10007;</div>
<div id="answer2" style="display:none;" class="rightanswer">&#10003;</div>


<p><input type="button" name="next2" value="Next" onClick="showDiv2()" /></p>
</body>
4

3 に答える 3

0

ここでやりたいことは、置換したいすべて<div>のコンテンツを 内に配置することです。

次に、その div にid属性を指定します。

例えば

<div id="yourID">
    HTML CONTENT HERE
</div>

onclick次に、JavaScript で、イベントで起動する関数を作成する必要があります。

マークアップ:

<input type="button" onclick="changeContent('yourID', '<div>OtherHTML</div>')" value="NEXT" />

これら 2 つのコンポーネントがある場合、関数を実行するスクリプトを作成する必要があります。

<script type="text/javascript">

    function changeContent(id, html) {
        //Get the element that needs it's contents replaced.
        var container = document.getElementById(id);

        //insert new HTML onclick.
        container.innerHTML = html;
    }

</script>

これは、必要なものの簡単な例です。この JavaScript を別のファイルに外部化できます。

これを行いたい場合は<head>、HTML ドキュメントの にスクリプトを含める必要があります。

<script type="text/javascript" src="path/to/js.js"></script>

これは DOM が読み込まれる前に読み込まれるため、エラーが発生します。

これを解決するために、ファイルの新しい内容は次のようになります。

js.js

window.onload = function() {

    function changeContent(id, html) {
        //Get the element that needs it's contents replaced.
        var container = document.getElementById(id);

        //insert new HTML onclick.
        container.innerHTML = html;
    }

}

これは、このシナリオでうまくいくはずです。

これが役に立ったことを願っています

‐ シド

于 2013-10-17T11:36:05.737 に答える