javascript - 单击清除文本框

标签 javascript jquery html flask

我正在制作一个基本的聊天网络应用程序。我实现了功能,现在我正在研究用户体验。我正在学习 JS 和 jQuery。我希望能够在我在框中单击以输入新文本/消息时立即清除文本输入框。我不知道该怎么做。这是我目前所拥有的。

我添加了这一行,认为它可以实现我的意图,但并没有发生。

$("form#my_msg").onclick().val("");

代码:

<script type="text/javascript">
    $(document).ready(function() {
        // connect
        var socket = io.connect('http://' + document.domain + ':' + location.port);

        // response to browser
        socket.on('response', function(msg) {
            $('#log').append("<br>" + msg.data);
        });

        // send message
        $('form#broadcast').submit(function(event) {
            socket.emit('send message', { data: "<b>" + $('#username').val() + "</b>" + " --> " + $('#my_msg').val()});
            return false;
        });


        $("form#my_msg").onclick().val("");
    });
</script>
<body class="body">
    <form id="broadcast" method="POST" action="#" class="form-group">
        <input type="text" id="username" placeholder="username" class="form-control">
        <input class="form-control" type="text" id="my_msg" placeholder="Enter message here...">
        <button type="submit" class="btn tbn-default" style="background-color: #80FF80;">Send</button>   
    </form>

    <h2>Chat</h2>
    <div id="log"></div>
</body>

最佳答案

你可以使用

$("#my_msg").val("");

$( "#my_msg" ).focusin(function() {
  $( this ).val("");
});

关于javascript - 单击清除文本框,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24381625/

相关文章:

javascript - 鉴于现有答案,更改 DatePicker 中的 minDate 选项不起作用

javascript - 如何顺利隐藏滚动条?

php - 更改隐藏字段的值

javascript - 在输入框中输入时搜索

javascript - 为什么我的水平 Owl Carousel slider 会垂直渲染元素?

javascript - div 相对于另外两个 div 的位置

javascript - 在 Javascript 中使用渐变方向来引导笔触效果

javascript - Jquery如何仅在条件为真时运行函数

jquery - 如果点击不是在特定的 div 上,请执行以下操作

html - 网格布局 - 固定列宽和响应式网格间隙