Skip to content

H
HTML-CSS-JS_514065

慢慢走～ / HTML-CSS-JS_514065

通知 1
Star 0
Fork 0
H
HTML-CSS-JS_514065

前往新版Gitcode，体验更适合开发者的 AI 搜索 >>

提交 eae510d9 编写于 作者: 慢慢走～'s avatar 慢慢走～
浏览文件
操作

Wed Jan 10 17:25:00 CST 2024 inscode

上级 840ab845
隐藏空白更改
内联 并排
Showing with 157 addition and 11 deletion
.inscode
浏览文件 @ eae510d9
run = "index.html" ```html
language = "node" <!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>祝福XXX赚大钱</title>
<style>
/* 添加样式 */
body {
background-color: #F5F5F5;
font-family: Arial, sans-serif;
}
[env] h1 {
PATH = "/root/${PROJECT_DIR}/.config/npm/node_global/bin:/root/${PROJECT_DIR}/node_modules/.bin:${PATH}" text-align: center;
XDG_CONFIG_HOME = "/root/.config" margin-top: 50px;
npm_config_prefix = "/root/${PROJECT_DIR}/.config/npm/node_global" color: #FF6600;
}
[debugger] #money {
program = "main.js" text-align: center;
margin-top: 50px;
}
#money img {
width: 50px;
height: 50px;
margin: 5px;
}
form {
text-align: center;
margin-top: 50px;
}
label {
font-size: 20px;
color: #333;
}
input[type=text] {
font-size: 20px;
padding: 10px;
border: none;
border-bottom: 2px solid #FF6600;
width: 300px;
margin-bottom: 20px;
}
button[type=submit] {
font-size: 20px;
padding: 10px 20px;
background-color: #FF6600;
color: white;
border: none;
border-radius: 5px;
cursor: pointer;
}
button[type=submit]:hover {
background-color: #FF9933;
}
</style>
</head>
<body>
<h1>祝福XXX赚大钱</h1>
<div id="money">
<!-- 添加撒钱效果 -->
</div>
<form>
<label for="name">请输入XXX的名字：</label>
<input type="text" id="name" name="name">
<button type="submit" id="submit">祝福</button>
</form>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
$(function() {
var money = $("#money");
var name = $("#name");
var submit = $("#submit");
/* 添加祝福功能 */
submit.click(function(e) {
e.preventDefault();
var nameVal = name.val();
if (nameVal === "") {
alert("请输入XXX的名字！");
return;
}
var html = "";
for (var i = 0; i < 10; i++) {
html += '<img src="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.0.1/images/money.svg" alt="money">';
}
money.html(html);
alert("祝福" + nameVal + "在新的一年里赚大钱！");
});
});
</script>
</body>
</html>
\ No newline at end of file
代码
浏览文件 @ eae510d9
```html
<!DOCTYPE html> <!DOCTYPE html>
<html lang="zh-CN"> <html lang="zh-CN">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>祝福XXX赚大钱</title> <title>祝福XXX赚大钱</title>
<style> <style>
/* 在这里添加样式 */ /* 添加样式 */
body {
background-color: #F5F5F5;
font-family: Arial, sans-serif;
}
h1 {
text-align: center;
margin-top: 50px;
color: #FF6600;
}
#money {
text-align: center;
margin-top: 50px;
}
#money img {
width: 50px;
height: 50px;
margin: 5px;
}
form {
text-align: center;
margin-top: 50px;
}
label {
font-size: 20px;
color: #333;
}
input[type=text] {
font-size: 20px;
padding: 10px;
border: none;
border-bottom: 2px solid #FF6600;
width: 300px;
margin-bottom: 20px;
}
button[type=submit] {
font-size: 20px;
padding: 10px 20px;
background-color: #FF6600;
color: white;
border: none;
border-radius: 5px;
cursor: pointer;
}
button[type=submit]:hover {
background-color: #FF9933;
}
</style> </style>
</head> </head>
<body> <body>
<h1>祝福XXX赚大钱</h1> <h1>祝福XXX赚大钱</h1>
<div id="money"> <div id="money">
<!-- 在这里添加撒钱的效果 --> <!-- 添加撒钱效果 -->
</div> </div>
<p>祝福XXX在新的一年里赚大钱！</p>
<form> <form>
<label for="name">请输入XXX的名字：</label> <label for="name">请输入XXX的名字：</label>
<input type="text" id="name" name="name"> <input type="text" id="name" name="name">
...@@ -25,6 +79,7 @@ ...@@ -25,6 +79,7 @@
var name = $("#name"); var name = $("#name");
var submit = $("#submit"); var submit = $("#submit");
/* 添加祝福功能 */
submit.click(function(e) { submit.click(function(e) {
e.preventDefault(); e.preventDefault();
var nameVal = name.val(); var nameVal = name.val();
...@@ -37,6 +92,7 @@ ...@@ -37,6 +92,7 @@
html += '<img src="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.0.1/images/money.svg" alt="money">'; html += '<img src="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.0.1/images/money.svg" alt="money">';
} }
money.html(html); money.html(html);
alert("祝福" + nameVal + "在新的一年里赚大钱！");
}); });
}); });
</script> </script>
......
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或