0

みんな私のウェブサイトでこれを行う方法を見つけることができません。ウェブサイト全体をカバーするものが必要です(背景が黒のdivでも画像でもかまいません)。ボディが読み込まれる前に質問が表示されます。

その人は入力に答えを入力して送信します。答えが正しければ(答えはhtmlに表示されます)、ボディが読み込まれるか、ページを覆っている黒い背景のdivが消えてWebサイトが表示されます。

ウェブサイトをカバーし、特定の単語を入力した後にのみ本文をロードするもの。誰か助けてもらえますか?:(

4

6 に答える 6

1

この質問にjQueryのタグを付けたので、を使用してjQueryダイアログを提案しmodal=trueます。

jQueryのサイトにあるモーダルフォームのを参照してください。ブロックからダイアログを開き、$(document).readyユーザーがフォームに正しい値を入力した場合にのみダイアログを閉じます。

ブラウザの開発者ツールバーの使用方法を知っているユーザーは、思いついたものをすべてバイパスできることに注意してください。

于 2012-08-16T17:52:13.333 に答える
1

そうですね、そのようなことを行うにはサーバーサイドスクリプトを使用する必要があると思います...
たとえば、php、asp、pythonなどを使用して回答を検証します。

于 2012-08-16T17:55:32.137 に答える
1

質問したい質問やその他の質問を含むHTMLページを作成します。

サーブレットへのアクションを含む送信ボタンを設定します。ユーザーが質問に回答した後に送信ボタンを押すと、回答がtrueであるかどうかサーブレットをチェックインし、request.getParameter
URLを最初に設定します。あなたのウェブサイトのページ、
そしてそれが偽の場合、あなたは彼がいた最初のページにURLを設定します...

于 2012-08-16T18:01:37.873 に答える
0

display: none答えが正しければ、を使用して本文の残りの部分(divで囲まれている)を非表示にし、その属性を変更できます。

$(function(){})モーダルの使用は、またはdocument.readyブロックでjQueryUIを使用する別のオプションです。

于 2012-08-16T17:53:41.260 に答える
0

体がロードされるのを防ぎ、人が答えを入力した後にそれを許可することとは考えないでください。2つのsから始め<div>ます。1つは質問を含み、もう1つは本文の内容を含みます。最初は「本体」divを非表示にし、ユーザーが質問に答えた後に表示します。

質問はbodyタグ内にあるため、全体を非表示にすることは意味がありませんbody

于 2012-08-16T17:54:38.783 に答える
0

http://jsfiddle.net/AMVA3/を参照してください

に次のコードを追加して、が読み込ま<head>れる前に実行されるようにすることができます。<body>

var ask=prompt('Write answer here:',"answer");
if(ask!="answer"){
    //If the answer is wrong, we stop the document's loading
    if(window.stop){
        window.stop();
    }else if(document.execCommand){
        document.execCommand('Stop');
    }else{
        document.write('<!--');
    }
}

したがって、質問をしている間、本文がロードされていないため、ページは白のみです。答えが正しければ、ドキュメントの読み込みが続行されます。そうでない場合は、ロードを停止します。

注:HTML静的ページでページの読み込みを停止する方法からドキュメントの読み込みを停止するコードを取得しました

編集:

「間違った答えです!」と警告したい場合は、間違っているかどうかを確認してから追加してください。

こちらをご覧ください:http://jsfiddle.net/AMVA3/1/

var ask=prompt('Write answer here:',"answer");
if(ask!="answer"){
    alert("Wrong answer!!");
    if(window.stop){
        window.stop();
    }else if(document.execCommand){
        document.execCommand('Stop');
    }else{
        document.write('<!--');
    }
}

編集2:

前のコードのアラートが機能しないのは奇妙です。私にとってはうまくいきます。

ただし、divのみをロードしないようにする場合は、コメントを使用できます。

ここでそれを参照してください:http://jsfiddle.net/AMVA3/3/

HTML:

<div class="a">
    You should se me
</div>
<div id="cover"></div>
<script type="text/javascript">
var wrongAnswer=prompt('Write answer here:',"answer")!="answer";
document.getElementById('cover').style.display='none';
if(wrongAnswer){
    alert("Wrong answer!!");
    document.write('<!--');
}
</script>
<div class="a hide">
    If you see me, you have written the right answer!
</div>
<script type="text/javascript">
if(!wrongAnswer){
    document.write('<!-- ');
}
</script>
-->
<div class="a">
    You should see me too
</div>

CSS:

#cover{position:fixed;top:0;left:0;height:100%;width:100%;
    background:yellow;/* Set it to the color that you want */
}
于 2012-08-16T21:09:50.827 に答える