Question

这是一个原型，所以我想要的是，当你点击文本区域没有任何东西的聊天时，'bot'文本会改变，并且每次都会有一个计数器，所以消息随后会出现不同。

但我得到的是，文字会改变，但随后页面会快速恢复。

头脑中的javascript

<script>
var emptyCount = 0;
function startR() {
 console.log("jkfj");
 var text = document.getElementById('talk').value;
 if (!text) {
     if (emptyCount == 0) {
         document.getElementById('bot').innerHTML = "<h2>You need to say something first</h2><br />";
         emptyCount++;
     } else if (emptyCount == 1) {
         document.getElementById('bot').innerHTML = "<h2>What's wrong with you?</h2><br />";
         emptyCount++;
     } else if (emptyCount == 2) {
         document.getElementById('bot').innerHTML = "<h2>If you send another blank message I will deactivate the chat button.</h2><br />";
         emptyCount++;
     } else {
         alert("asd");
         $.ajax({
             url: 'queryBot.php',
             type: 'get',
             data: {
                 text: text
             },
             async: false,
             success: function (data) {
                 document.getElementById('bot').innerHTML = "<h2>" + data + "</h2><br />";
             },
             cache: false
         });
     }
 }
}
</script>

HTML组件

<div id="bot">
    <h2>What do you want?</h2><br />
</div>
<input id="talk" type="textarea" class="tb5" name="searchterm" placeholder="Type to talk">
<input id="chat" type="submit" class="btn btn-success" onclick="startR()" value="Chat">

Answer 1

您正在使用输入type=submit提交表单。尝试添加没有类型提交的按钮或向表单添加eventlistener并添加event.preventDefault()。

Javascript：onclick函数工作一次然后页面恢复为原始

1 个答案: