Flask聊天应用前端JS问题求助：无法正确获取输入框文本

你遇到的问题是因为直接将HTML输入框元素本身赋值给了innerHTML，而不是获取输入框里的文本内容。document.getElementById("text2")返回的是一个DOM元素对象，当你把它赋值给innerHTML时，会默认转换为对象的字符串表示[object HTMLInputElement]。

只需要修改JavaScript函数里的赋值语句，加上.value来获取输入框的文本内容：

function chat(){
  document.getElementById("p1").innerHTML = document.getElementById("text2").value;
}

修改后的完整Flask代码如下：

from flask import Flask
app = Flask('app')

@app.route('/')
def hello_world():
  return 'Chat app \
          <br> \
          <h1 id="p1">text</h1> \
          <input id="text2"> \
          <button onclick="chat()">Chat</button> \
          <script> \
          function chat(){ \
            document.getElementById("p1").innerHTML = document.getElementById("text2").value; \
          } \
          </script>'

app.run(host='0.0.0.0', port=8080)

这样点击按钮后，就能把输入框里的文本替换到p1元素中了。

内容的提问来源于stack exchange，提问作者Loves2Code