我做了一个聊天机器人。我叫苏菲。它运行得很好,但是我认为,如果我每次都响应未预先定义给她的事情,那该怎么办。因此,我决定制作一个随机的Number生成器,并指定如果该数字为数字,则将发生这种情况。在编写代码时,它变得有些复杂并停止工作。 这是无效的代码:
<!DOCTYPE html>
<html>
<head>
<title> Your new Buddy </title>
</head>
<body>
<div class="messagedisplayarea">
</div>
<div class="sendarea"> <input type="text" id="input001" placeholder="Message..." class="textinput">
<button onclick="btn001(); btn002(); btn003;" id="submit" class="send"> Send </button> </div>
<p id="message002" class="myMessage">Me:<br>
<p id="message001" class="text">Sophie: <br>Hi!<br></p>
<script>
var value = false;
}
function options() {
document.getElementById("optionMenu").innerHTML = "Talking tips with Sophie";
}
function btn002() {
var my = input001.value;
document.getElementById("message002").innerHTML = "Me: " + my;
}
function btn001() {
var colors001 = input001.value;
if (colors001 == "hi") {
document.getElementById("message001").innerHTML = "Sophie: " + "Hi. How are you?";
}
else if (colors001 == "Hi") {
document.getElementById("message001").innerHTML = "Sophie: " + "Hey! How are you?";
}
else if (colors001 == "Hello") {
document.getElementById("message001").innerHTML = "Sophie: " + "Hey! How are you?";
}
else if (colors001 == "") {
document.getElementById("message001").innerHTML = "Sophie: " + "Atleast type something xD";
}
else if (colors001 == "hello") {
document.getElementById("message001").innerHTML = "Sophie: " + "Hey! How are you?";
}
else if (colors001 == "i am fine") {
document.getElementById("message001").innerHTML = "Sophie: " + "That is great!";
}
else if (colors001 == "How are you?") {
document.getElementById("message001").innerHTML ="Sophie: " + "I am fine. I am so excited to know more about you!";
}
else if (colors001 == "Who made you?") {
document.getElementById("message001").innerHTML = "Sophie: " + "Soham Grover!!";
}
else if (colors001 == "I'm fine") {
document.getElementById("message001").innerHTML = "Sophie: " + "Nice";
}
else if (colors001 == "I'm fine") {
document.getElementById("message001").innerHTML = "Sophie: " + "Nice";
}
else if (colors001 == "who made you?") {
document.getElementById("message001").innerHTML = "Sophie: " + "It's Soham.";
}
else if (colors001 == "I am fine") {
document.getElementById("message001").innerHTML = "Sophie: " + "Awesome!";
}
else if (colors001 == "") {
document.getElementById("message001").innerHTML = "Sophie: " + "";
}
else if (colors001 == "What is my name?") {
document.getElementById("message001").innerHTML = "Sophie: " + "I forgot. Sorry!
}
else if (colors001 == "What is your name?") {
document.getElementById("message001").innerHTML = "Sophie: " + "My Name is Sophie.";
}
else if (colors001 == "Ok") {
document.getElementById("message001").innerHTML = "Sophie: " + "Ok";
}
else if (colors001 == "I am fine") {
document.getElementById("message001").innerHTML = "Sophie: " + "Awesome!";
}
else if (colors001 == "Cool") {
document.getElementById("message001").innerHTML = "Sophie: " + "Thanks";
}
else if (colors001 == "Thank you") {
document.getElementById("message001").innerHTML = "Sophie: " + "You are Welcome";
}
else if (colors001 == "Thanks") {
document.getElementById("message001").innerHTML = "Sophie: " + "Welcome";
}
else if (colors001 == "Thnx") {
document.getElementById("message001").innerHTML = "Sophie: " + "You are Welcome";
}
else if (colors001 == "Ty") {
document.getElementById("message001").innerHTML = "Sphie: " + "You are Welcome";
}
else if (colors001 == "Why?") {
document.getElementById("message001").innerHTML = "Sophie: " + "Just like that.";
}
else if (colors001 == "You are dumb") {
document.getElementById("message001").innerHTML = "Sophie " + "I'm Sorry if you feel so.";
}
else {
document.getElementById("message001").innerHTML = "Sophie " + "Sorry?";
}
}
</script>
<style>
.text:hover {
background: lightyellow;
font-size: 42px;
font-family: cursive;
}
.messagedisplayarea {
background: lightyellow;
width: 100%;
height: 1000px;
float: left;
z-index: -1;
border: 5px solid black;
}
.textinput {
font-size: 40px;
width: 730px;
height: 80px;
position: absolute;
left: 20%;
bottom: 60px;
z-index: 2;
display: inline;
border-radius: 25px 25px 25px 25px;
border: 2px solid white;
}
.textinput:hover {
border: 1px solid black;
font-size: 50px;
}
.options {
position: absolute;
color: black;
right: 100px;
top: 10px;
height: 5px;
}
.optionMenu {
z-index: 3;
background: white;
border: 1px solid black;
color: black;
}
.send {
font-size: 40px;
color: white;
position: absolute;
left: 70%;
bottom: 4%;
z-index: 2;
display: inline;
border-radius: 75px 75px 75px 75px;
width: 150px;
height: 150px;
border:0.1em solid #FFFFFF;
background: lightgreen;
transition-delay:all 0.3s ease-in;
}
.send:hover {
font-size: 50px;
color: yellow;
background: yellowgreen;
}
.sendarea {
display: inline;
height: auto;
width: auto;
}
.myMessage {
color: black;
font-size: 40px;
height: auto;
text-align: center;
position: absolute;
top: 2px;
width: 300px;
left: 55%;
background: yellow;
border-radius: 10px 10px 10px 10px;
transition: all 1s ease-in;
}
.myMessage:hover {
background: white;
font-size: 42px;
font-family:cursive;
}
.text {
font-size: 60px;
position: absolute;
left: 10%;
top: 200px;
background: white;
padding: 20px 20px 20px 20px;
border-radius: 10px 10px 10px 10px;
font-family: monospace;
width: 300px;
height: auto;
transition: all 1s ease-in;
z-index: 1;
}
@media(max-width: 768px) {
.myMessage {
font-size: 60px;
font-family: monospace;
text-align: center;
position: absolute;
top: 2px;
width: 300px;
height: 200px;
left: 60%;
background: yellow;
border-radius: 10px 10px 10px 10px;
}
.text {
font-size: 60px;
position: absolute;
left: 10%;
top: 150px;
background: white;
padding: 20px 20px 20px 20px;
border-radius: 10px 10px 10px 10px;
font-family: monospace;
width: 300px;
height: auto;
transition: all 1s ease-in;
z-index: 1;
}
}
</style>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title> Your new Buddy </title>
</head>
<body>
<div class="messagedisplayarea">
</div>
<div class="sendarea"> <input type="text" id="input001" placeholder="Message..." class="textinput">
<button onclick="btn001(); btn002(); btn003;" id="submit" class="send"> Send </button> </div>
<p id="message002" class="myMessage">Me:<br>
<p id="message001" class="text">Sophie: <br>Hi!<br></p>
<script>
var value = false;
function btn003() {
var random = Math.floor((Math.random() * 10) + 1);
if (value==true && random==1) {
document.getElementById("message001").innerHTML = "Sophie: " + "Sorry?";
}
else if (value==true && random==2) {
document.getElementById("message001").innerHTML = "Sophie: " + "I didn't get that.";
}
else if (value==true && random==3) {
document.getElementById("message001").innerHTML = "Sophie: " + "Ughhh! I'm Sorry!";
}
else if (value==true && random==4) {
document.getElementById("message001").innerHTML = "Sophie: " + "Sorry, but I didn't understand.";
}
else if (value==true && random==5) {
document.getElementById("message001").innerHTML = "Sophie: " + "This is difficult for me to understand";
}
else if (value==true && random==6) {
document.getElementById("message001").innerHTML = "Sophie: " + "Error!";
}
else if (value==true && random==7) {
document.getElementById("message001").innerHTML = "Sophie: " + "Unknown Spelling Error";
}
else if (value==true && random==8) {
document.getElementById("message001").innerHTML = "Sophie: " + "This is hard for me to understand";
}
else if (value==true && random==9) {
document.getElementById("message001").innerHTML = "Sophie: " + "Can you say that again?";
}
else if (value==true && random==10) {
document.getElementById("message001").innerHTML = "Sophie: " + "What?????";
}
}
function options() {
document.getElementById("optionMenu").innerHTML = "Talking tips with Sophie";
}
function btn002() {
var my = input001.value;
document.getElementById("message002").innerHTML = "Me: " + my;
}
function btn001() {
var colors001 = input001.value;
if (colors001 == "hi") {
document.getElementById("message001").innerHTML = "Sophie: " + "Hi. How are you?";
}
else if (colors001 == "Hi") {
document.getElementById("message001").innerHTML = "Sophie: " + "Hey! How are you?";
}
else if (colors001 == "Hello") {
document.getElementById("message001").innerHTML = "Sophie: " + "Hey! How are you?";
}
else if (colors001 == "") {
document.getElementById("message001").innerHTML = "Sophie: " + "Atleast type something xD";
}
else if (colors001 == "hello") {
document.getElementById("message001").innerHTML = "Sophie: " + "Hey! How are you?";
}
else if (colors001 == "i am fine") {
document.getElementById("message001").innerHTML = "Sophie: " + "That is great!";
}
else if (colors001 == "How are you?") {
document.getElementById("message001").innerHTML ="Sophie: " + "I am fine. I am so excited to know more about you!";
}
else if (colors001 == "Who made you?") {
document.getElementById("message001").innerHTML = "Sophie: " + "Soham Grover!!";
}
else if (colors001 == "I'm fine") {
document.getElementById("message001").innerHTML = "Sophie: " + "Nice";
}
else if (colors001 == "I'm fine") {
document.getElementById("message001").innerHTML = "Sophie: " + "Nice";
}
else if (colors001 == "who made you?") {
document.getElementById("message001").innerHTML = "Sophie: " + "It's Soham.";
}
else if (colors001 == "I am fine") {
document.getElementById("message001").innerHTML = "Sophie: " + "Awesome!";
}
else if (colors001 == "") {
document.getElementById("message001").innerHTML = "Sophie: " + "";
}
else if (colors001 == "What is my name?") {
document.getElementById("message001").innerHTML = "Sophie: " + "I forgot. Sorry!
}
else if (colors001 == "What is your name?") {
document.getElementById("message001").innerHTML = "Sophie: " + "My Name is Sophie.";
}
else if (colors001 == "Ok") {
document.getElementById("message001").innerHTML = "Sophie: " + "Ok";
}
else if (colors001 == "I am fine") {
document.getElementById("message001").innerHTML = "Sophie: " + "Awesome!";
}
else if (colors001 == "Cool") {
document.getElementById("message001").innerHTML = "Sophie: " + "Thanks";
}
else if (colors001 == "Thank you") {
document.getElementById("message001").innerHTML = "Sophie: " + "You are Welcome";
}
else if (colors001 == "Thanks") {
document.getElementById("message001").innerHTML = "Sophie: " + "Welcome";
}
else if (colors001 == "Thnx") {
document.getElementById("message001").innerHTML = "Sophie: " + "You are Welcome";
}
else if (colors001 == "Ty") {
document.getElementById("message001").innerHTML = "Sphie: " + "You are Welcome";
}
else if (colors001 == "Why?") {
document.getElementById("message001").innerHTML = "Sophie: " + "Just like that.";
}
else if (colors001 == "You are dumb") {
document.getElementById("message001").innerHTML = "Sophie " + "I'm Sorry if you feel so.";
}
else {
value = true;
}
}
</script>
<style>
.text:hover {
background: lightyellow;
font-size: 42px;
font-family: cursive;
}
.messagedisplayarea {
background: lightyellow;
width: 100%;
height: 1000px;
float: left;
z-index: -1;
border: 5px solid black;
}
.textinput {
font-size: 40px;
width: 730px;
height: 80px;
position: absolute;
left: 20%;
bottom: 60px;
z-index: 2;
display: inline;
border-radius: 25px 25px 25px 25px;
border: 2px solid white;
}
.textinput:hover {
border: 1px solid black;
font-size: 50px;
}
.options {
position: absolute;
color: black;
right: 100px;
top: 10px;
height: 5px;
}
.optionMenu {
z-index: 3;
background: white;
border: 1px solid black;
color: black;
}
.send {
font-size: 40px;
color: white;
position: absolute;
left: 70%;
bottom: 4%;
z-index: 2;
display: inline;
border-radius: 75px 75px 75px 75px;
width: 150px;
height: 150px;
border:0.1em solid #FFFFFF;
background: lightgreen;
transition-delay:all 0.3s ease-in;
}
.send:hover {
font-size: 50px;
color: yellow;
background: yellowgreen;
}
.sendarea {
display: inline;
height: auto;
width: auto;
}
.myMessage {
color: black;
font-size: 40px;
height: auto;
text-align: center;
position: absolute;
top: 2px;
width: 300px;
left: 55%;
background: yellow;
border-radius: 10px 10px 10px 10px;
transition: all 1s ease-in;
}
.myMessage:hover {
background: white;
font-size: 42px;
font-family:cursive;
}
.text {
font-size: 60px;
position: absolute;
left: 10%;
top: 200px;
background: white;
padding: 20px 20px 20px 20px;
border-radius: 10px 10px 10px 10px;
font-family: monospace;
width: 300px;
height: auto;
transition: all 1s ease-in;
z-index: 1;
}
@media(max-width: 768px) {
.myMessage {
font-size: 60px;
font-family: monospace;
text-align: center;
position: absolute;
top: 2px;
width: 300px;
height: 200px;
left: 60%;
background: yellow;
border-radius: 10px 10px 10px 10px;
}
.text {
font-size: 60px;
position: absolute;
left: 10%;
top: 150px;
background: white;
padding: 20px 20px 20px 20px;
border-radius: 10px 10px 10px 10px;
font-family: monospace;
width: 300px;
height: auto;
transition: all 1s ease-in;
z-index: 1;
}
}
</style>
</body>
</html>