0

伙计们，我在我的网站上找不到这样做的方法。我需要涵盖整个网站的东西（可以是黑色背景的 div 或图像，等等），并且在正文加载之前出现问题。

该人在输入中键入答案并提交，如果答案是正确的（答案可以在 html 上可见）然后加载正文，或者覆盖页面的黑色背景的 div 消失，显示网站。

任何涵盖网站且仅在输入某个单词后才加载正文的内容。有谁能够帮我？:(

4

6 回答 6

1

你用 jQuery 标记了这个问题，所以我建议使用modal=true.

请参阅jQuery 网站上的模态表单示例。您将从一个$(document).ready块中打开对话框，并且仅当用户在表单中输入正确的值时才关闭它。

请记住，知道如何使用浏览器的开发人员工具栏的用户可以绕过您提出的任何建议。

于 2012-08-16T17:52:13.333 回答
1

好吧，我认为你需要使用服务器端脚本来做类似的事情......
例如使用 php、asp、python 等验证答案。

于 2012-08-16T17:55:32.137 回答
1

用你想问的问题或任何你想要的东西制作一个 HTML 页面。

为 servlet 设置一个带有操作的提交按钮，当用户在回答您的问题后点击提交按钮时，如果答案为真，您将检查 servlet，request.getParameter
您将设置一个 URL 为第一个您网站的页面，
如果它是错误的，您会将 URL 设置为他所在的第一页...

于 2012-08-16T18:01:37.873 回答
0

display: none如果答案正确，您可以使用隐藏身体的其余部分（包含在 div 中）并更改该属性。

使用模式是另一种选择，在$(function(){})ordocument.ready块中使用 jQueryUI。

于 2012-08-16T17:53:41.260 回答
0

不要认为它阻止身体加载，然后在人们输入答案后允许它。从两个开始<div>，一个包含问题，一个包含正文内容。最初隐藏“正文”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('<!--');
    }
}

因此，当您提出问题时，页面只是白色的，因为正文尚未加载。如果答案正确，则继续加载文档。如果没有，它将停止加载。

注意：我已经从How to stop page load in html static page 中获取了停止文档加载的代码

编辑：

如果要提醒“错误答案！”，请检查是否错误后添加。

在这里看到它：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 回答