1

それが私の質問です (非常に簡単な質問かもしれませんが、JavaScript はまったくの初心者です)。だから私は引用のリストを持っています。ユーザーがウィンドウのどこかをクリックするたびに、必要な時系列に基づいて引用を変更するスクリプトが必要です。そして、見積もりが終了したら、もう一度再開します。したがって、ユーザーがページを開くとすぐに、ユーザーがどこでもクリックするよりも quote1 の段落があり、これが発生するとしましょう。同じ段落が quote2 を取得します。

4

3 に答える 3

2

未解決の質問がたくさんあるので、具体的な回答をするのはかなり難しいです。ただし、概念的には次の手順を実行します。

  1. 目的のクリックが発生したときにコードが呼び出されるように、クリック イベント ハンドラーを登録します。
  2. クリック ハンドラーが呼び出されたら、変更する<p>タグの DOM オブジェクトを取得する必要があります。
  3. 次に、表示する次の見積もりを取得する必要があります。おそらく、これらを配列に格納し、現在表示している配列位置のインデックスを保持して、次のものを取得できるようにします。これをさまざまなページの読み込みで機能させたい場合は、インデックスを Cookie に保存して、このコンピューターの他のページの読み込みでも保持されるようにする必要があります。
  4. DOM 要素と引用を取得したら、DOM 要素の innerHTML プロパティを設定して、目的の引用を挿入します。

HTML が次の場合:

<p id="theQuote">This is the first quote</p>

そして、このボタンをクリックして見積もりを変更する必要があります。

<button onclick="changeQuote()">Change Quote</button>

または、ページ内の任意の場所をクリックしたい場合は、これを body タグに使用できます。

<body onclick="changeQuote()">

次に、次のコードでそれを行うことができます。

var quoteIndex = 0;
var quotes = [
    "First Quote",
    "Second Quote",
    "Third Quote"
];
function changeQuote() {
    ++quoteIndex;
    if (quoteIndex >= quotes.length) {
        quoteIndex = 0;
    }
    document.getElementById("theQuote").innerHTML = quotes[quoteIndex];
}

ページ内のどこかをクリックして引用を回転させたい場合 (これは適切なデザインではないようです)、代わりにクリック ハンドラーを body タグに割り当てることができます。

于 2012-12-24T04:39:45.470 に答える
0

何を試しましたか？

ここでは、コードを高速化するためにjqueryを使用しています

var quotes = ["quote1","quote2"];
var current = 0;

function changeQuote(){
    if (current >= quotes.length) current = 0;
    document.getElementById("paragraph").innerHTML(quotes[current]);
    current++;
}

document.body.onclick = changeQuote;
于 2012-12-24T04:42:10.510 に答える
0

次のようなことを試してください：

<html>
<head>
<script type="text/javascript">
    var quotes = ["Quote 1", "Quote 2"]
    var index = 0;

    function updateQuote() {
        index = index + 1;
        if(index == quotes.length) {
            index = 0;
        }

        document.getElementById("myQuote").innerHTML = quotes[index];
    }
</script>
</head>
<body onClick="updateQuote(); return false;">
<p id="myQuote"></p>
</body>
</html>
于 2012-12-24T04:42:14.270 に答える