按键输入后清除文本字段

Question

我正在使用一个简单的聊天脚本，需要一种在按下回车键后清除文本字段的方法。

我用 onfocus 清除了鼠标单击时的文本字段，但按键让我望而却步。也有没有一种方法可以用一个命令来完成这两项工作，使代码更清晰？

<form onsubmit="chat.sendMsg(); return false;">
    <input onfocus="if(this.value !== '') {this.value=''}" onblur="if(this.value == '')" type="text" id="msg" name="msg" autofocus="true" placeholder="Type Your Meassage Here" />
    <input type="submit" value="Enter" />
</form>

Answer 1

<form onsubmit="chat.sendMsg(); this.msg.value = ''; return false;">
    <input onfocus="if(this.value !== '') {this.value=''}" onblur="if(this.value == '')" type="text" id="msg" name="msg" autofocus="true" placeholder="Type Your Meassage Here" />
    <input type="submit" value="Enter" />
</form>

或

<form onsubmit="chat.sendMsg(); this[0].value = ''; return false;">
        <input onfocus="if(this.value !== '') {this.value=''}" onblur="if(this.value == '')" type="text" id="msg" name="msg" autofocus="true" placeholder="Type Your Meassage Here" />
        <input type="submit" value="Enter" />
</form>

Answer 2

首先，如今，使用事件属性已经过时到不良做法的地步。相反，使用 JS 连接您的事件。当您用 jQuery 标记问题时，试试这个：

<form>
    <input type="text" id="msg" name="msg" autofocus="true" placeholder="Type Your Meassage Here" />
    <input type="submit" value="Enter" />
</form>

$(function() {
    $('form').submit(function(e) {
        e.preventDefault();
        chat.sendMsg();
        $('#msg').val(''); // clear the message box
    });

    $('#msg').on('focus', function() {
        this.value = '';
    });
});

请注意，我删除了 blur 处理程序，因为它实际上没有执行任何操作。

按键输入后清除文本字段

Clear text field after keypress enter

javascript

forms

jquery

textfield