- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
对花生酱和果冻进行简单的多项选择、简短回答和多项 react 测验:)。我想做的是,当用户单击“提交”按钮时,它会显示正确或错误答案的数量。另外,问题旁边会显示他们选择的选择是正确还是不正确,例如在多项选择问题上,如果他们选择正确的答案(果冻),那么它会说“正确!”在该选项旁边。现在,当我单击“提交”时,什么也没有发生,不知道为什么,我以为它会弹出一个金额正确的警报,但什么也没有发生。我确信我错过了一些非常简单的东西,但由于某种原因它没有为我弹出,所以任何帮助将不胜感激。谢谢!
<!DOCTYPE html>
<html lang="en">
<head>
<title>
How to make a proper Peanut Butter and Jelly
</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="css/normalize.css">
<link rel="stylesheet" href="css/main.css">
<script src = "scripts/main.js"></script>
</head>
<body>
<header>
</header>
<main>
<form id = "quiz" name = "quiz">
<p>what item do you use to spread peanut butter on the bread?</p>
<input id = "textbox" type = "text" name = "question1">
<p>what is one ingrediant of peanut butter and jelly sandwich?</p>
<input type = "radio" id = "mc" name = "question2" value = "cheese"> cheese <br>
<input type = "radio" id = "mc" name = "question2" value = "bacon"> bacon <br>
<input type = "radio" id = "mc" name = "question2" value = "jelly"> jelly <br>
<p>which of the following are correct ingredients required to make a Peanut Butter and Jelly sandwich?</p>
<input type = "checkbox" id = "mc" name = "question2" value = "bread"> bread <br>
<input type = "checkbox" id = "mc" name = "question2" value = "cheese"> cheese <br>
<input type = "checkbox" id = "mc" name = "question2" value = "peanut butter"> peanut butter <br>
<input type = "checkbox" id = "mc" name = "question2" value = "jelly"> jelly <br>
<input type = "checkbox" id = "mc" name = "question2" value = "toothpaste"> toothpaste <br>
<br>
<input id = "button" type = "button" value = "Submit Quiz" onclick = "check():">
<br>
</form>
</main>
<footer>
</footer>
</body>
JavaScript代码
function src(){
var question1 = document.quiz.question1.value;
var question2 = document.quiz.question2.value;
var question3 = document.quiz.question3.value;
var correct = 0;
var incorrect = 0;
if (question1 == "knife")
{
alert("correct!");
correct++;
}
else{
alert("incorrect");
incorrect++;
}
if(question2 == "jelly")
{
alert("correct!");
correct++;
}
else{
alert("incorrect");
incorrect++;
}
if(question3 == "bread"||"jelly"||"peanut butter"){
alert("correct!");
correct++
}
else{
alert("incorrect");
incorrect;
}
alert(correct);
}
最佳答案
首先,您似乎熟悉其他编程语言。例如 C# 或 java,但您不了解 DOM 操作的基础知识。所以现在请耐心等待,直到我向您详细解释。
首先,DOM 是(文档对象模型),它基本上是使用标记语言 (HTML) 创建的图像。基本上这是在浏览器上显示并由 javascript 操作的内容。就像本页上的按钮或我现在正在输入的文本框或上面的导航栏。
因此,快速回顾一下 DOM 是使用 HTML 创建并使用 javascript 操作的。
由于 DOM 是由 html 创建的,因此在加载 html 之前您将无法操作它。在 html 页面顶部添加 script 标记意味着您运行不存在的操作。因此,您必须在 html 页面末尾添加 script 标签,位于正文结束标签之前。
<script src = "scripts/main.js"></script>
</body>
现在,当您想要操作一个元素时,您必须将其存储在变量中,而执行此操作的方法是使用选择器。
您有三个选项,但为了节省时间,我不会列出这 3 个选项,而是列出最好且最常用的一个。你可以用谷歌搜索其他的,但我认为这不值得。
因此,如果您了解 css,您可以通过名称、id 或类来选择组件。javascript 中有一个叫做查询选择器的东西,它的用法如下。
var x = document.queryselector('css-selector');
您添加一个 css 选择器来代替 css-selector 部分。例如,如果元素具有“英雄”类别。您将用 .hero 替换 css-selector,或者如果它的 id 为“hero”,您将用 #id 替换 css-selector。
那么你应该使用变量名来操作元素。
这里有更多有用的链接,您可以查看。 JavaScript
关于javascript - 在 html/javascript 警报中进行测验不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49479026/
今天有小伙伴给我留言问到,try{...}catch(){...}是什么意思?它用来干什么? 简单的说 他们是用来捕获异常的 下面我们通过一个例子来详细讲解下
我正在努力提高网站的可访问性,但我不知道如何在页脚中标记社交媒体链接列表。这些链接指向我在 facecook、twitter 等上的帐户。我不想用 role="navigation" 标记这些链接,因
说现在是 6 点,我有一个 Timer 并在 10 点安排了一个 TimerTask。之后,System DateTime 被其他服务(例如 ntp)调整为 9 点钟。我仍然希望我的 TimerTas
就目前而言,这个问题不适合我们的问答形式。我们希望答案得到事实、引用资料或专业知识的支持,但这个问题可能会引发辩论、争论、投票或扩展讨论。如果您觉得这个问题可以改进并可能重新打开,visit the
我就废话不多说了,大家还是直接看代码吧~ ? 1
Maven系列1 1.什么是Maven? Maven是一个项目管理工具,它包含了一个对象模型。一组标准集合,一个依赖管理系统。和用来运行定义在生命周期阶段中插件目标和逻辑。 核心功能 Mav
我是一名优秀的程序员,十分优秀!