老师有需要修改的吗?

来源:1-19 自由编程

BirdMan98

2020-02-01 11:42:10

<!DOCTYPE html >


<html>

<head>

<meta charset="UTF-8">

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>jQuery练习</title>


<style type="text/css">

.div1{


float: left;

width: 50px;

line-height: 30px;

background-color: lightgray;

margin-left: 10px;

text-align: center;

vertical-align: middle;

}

.div2{

width: 300px;

height: 300px;

border: solid gray 1px;

margin-top: 60px;

color: red;

}

</style>



</head>

<body>

<h2>请选择背景颜色</h2>

<div>

<div id="blue" class="div1">蓝色</div>

<div id="green" class="div1">绿色</div>

</div>

<div class="div2" id="bg">

</div>

<div>输入颜色首字母: <input type="text" name="color"></div>

<script type="text/javascript" src="js/jquery-3.4.1.js"></script>

<script type="text/javascript">

alert("欢迎来到设置颜色的页面!");

$("div[id='blue']").click(function(){

$(".div2").css({"background-color":"blue","color":"red"});

$(".div2").text("蓝色背景");

});

$("div[id='green']").click(function(){

$(".div2").css({"background-color":"green","color":"red","font-style":"italic"});

$(".div2").text("绿色背景");

});

$("INPUT[name='color']").keypress(function(event){

if(event.keyCode==66){

$(".div2").text(" ");

$(".div2").css({"background-color":"blue"});

}else if(event.keyCode==71){

$(".div2").text(" ");

$(".div2").css({"background-color":"green"});

}

});

</script>

</body>

</html>


写回答

1回答

好帮手慕酷酷

2020-02-01

同学你好,老师测试同学的代码编写的符合题目的要求,代码完成的很棒!不需要修改了,继续努力!

如果我的回答解决了你的疑惑,请采纳!祝学习愉快!

0

0 学习 · 9666 问题

查看课程