如何修改此HTML文档以使用DOM 2事件模型
[英]How do I revise this HTML document to use the DOM 2 Event Model
问题描述
I am confused, I was able to successfully complete the document using DOM 0 Evemt model. 
我很困惑，我能够使用DOM 0 Evemt模型成功完成文档。 I am just not sure how to revises it to meet the DOM 2 Event model standards. 我只是不确定如何修改它以满足DOM 2事件模型标准。 I have asked difference tutors from Chegg and they can't figure it out either. 我问过Chegg的差异导师，他们也不知道。 Surely someone on here can help me out!:) 当然，这里有人可以帮助我！:)
PS I have read several different articles such as this one http://cs.loc.edu/~chu/ITEC315/ch5/DOM2.html that talks about DOM2 and even give an example of what a DOM2 event model document looks like. PS，我已经阅读了几篇不同的文章，例如http://cs.loc.edu/~chu/ITEC315/ch5/DOM2.html ，它讨论了DOM2，甚至给出了DOM2事件模型文档的示例。 I think it looks pretty similar to DOM 0 but it still not making sense to me. 我认为它看起来与DOM 0非常相似，但对我来说仍然没有意义。 I just need someone to look at my document and really guide me through it and point stuff out. 我只需要一个人查看我的文档，并真正指导我完成该文档并指出内容即可。 Like "this is how you do what you got here in the DOM2 event model way. 就像“这就是您如何以DOM2事件模型的方式来完成操作一样。
Thank you Drake! 谢谢德雷克！
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="generator" content="CoffeeCup HTML Editor (www.coffeecup.com)"> <meta name="dcterms.created" content="Tue, 02 Oct 2018 05:15:54 GMT"> <meta name="description" content=""> <meta name="keywords" content=""> <title>Assignment1 M5A1</title> </head> <body> <h4>Pick your favorite color!</h4> <form id="myform" action=""> <p> <label> <input type="radio" name= "ColorButton" value="1" onclick = "Colorchoice(1)"/> Red </label> <br /> <label> <input type="radio" name= "ColorButton" value="2" onclick = "Colorchoice(2)"/> Blue </label> <br /> <label> <input type="radio" name= "ColorButton" value="3" onclick = "Colorchoice(3)"/> Green </label> <br /> <label> <input type="radio" name= "ColorButton" value="4" onclick = "Colorchoice(4)"/> Yellow </label> <br /> <label> <input type="radio" name= "ColorButton" value="5" onclick = "Colorchoice(5)"/> Orange </label> <br /> </p> </form> <script> function Colorchoice(Color) { switch(Color){ case 1: alert("Your favorite color is Red"); break; case 2: alert("Your favorite color is Blue"); break; case 3: alert("Your favorite color is Green"); break; case 4: alert("Your favorite color is Yellow"); break; case 5: alert("Your favorite color is Orange"); break; default: alert("Error in JavaScript function Colorchoice"); break; } } </script> </body> </html>
1 个解决方案
解决方案1
0 已采纳 2018-10-05 08:36:43
Looks like it's working... https://jsfiddle.net/audshwr0/ 看起来像在工作... https://jsfiddle.net/audshwr0/
<h4>Pick your favorite color!</h4>
<form id="myform" action="">
<p>
<label>
<input type="radio" name= "ColorButton" value="1" onclick = "Colorchoice(event)"/>
Red
</label>
<br />
<label>
<input type="radio" name= "ColorButton" value="2" onclick = "Colorchoice(event)"/>
Blue
</label>
<br />
<label>
<input type="radio" name= "ColorButton" value="3" onclick = "Colorchoice(event)"/>
Green
</label>
<script>
function Colorchoice(event) {
console.log(event.target.value);
}
</script>
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.