addEventListener 未将 HTML 输入消息发送到控制台

Question

我在HTML中有输入字段和按钮。

<div class="chat-input" id="chat-input">
<input type="text" id="input-msg" placeholder="Enter message..."/>
<button class="send-btn" type="button" id="send-btn">
<img src="send.png" alt="send-btn">
</button>
</div>

我在客户端javascript文件中创建了输入部分和按钮的常量。

const user_send =document.querySelector("#send-btn");
const user_msg=document.querySelector("#input-msg");

并在发送按钮中添加eventlistener。

user_send.addEventListener("submit",()=>{
const msg = user_msg.value;
console.log(msg);
});

但是它不会将值发送到控制台。

我也尝试通过getElementById，但它不工作。

Answer 1

代替addEventListener("submit"..由user_send.addEventListener("click"当用户单击按钮时，const获取输入的值。

Answer 2

试试这个

const user_send = document.querySelector("#send-btn");
const user_msg = document.querySelector("#input-msg");
user_send.addEventListener("click", () => {
const msg = user_msg.value;
console.log(msg);
});

<div class="chat-input" id="chat-input">
<input type="text" id="input-msg" placeholder="Enter message..." />
<button class="send-btn" type="button" id="send-btn">
<img src="send.png" alt="send-btn">
</button>
</div>