我正在用 KnockoutJS 和 Node.js 编写一个小型聊天客户端/服务器应用程序,一切都很好,除了发送消息后,我失去了对消息字段的关注,用户必须重新点击每次他们想输入时(非常烦人)。你们知道我能做什么吗?这是模板:
<script type="text/html" id="chatRoom">
<div id="chatContainer" class="chatContainer">
<div class="chatFrom">
<i id="chatClose" class="chatSprite chatClose" data-bind='click: function() { server.removeChat(this) }'></i>
</div>
<div class="chatMessages">
<ul id="chatHolder">
{{each messages()}}
<li><div class="chatFromText">From: ${ from }</div>
<div class="chatTime">${ time }</div><div class="chatMsg">${ text }</div></li>
{{/each}}
</ul>
</div>
<div class="chatControls">
<form data-bind="submit: function() { send($('#'+channel).val()); $('#'+channel).focus(); }">
<input type="text" id="${ channel }" name="message" class="chatText" style="color: #999;" value="Message Here" data-bind='click: function() {
$("#"+channel).val("").css("color", "#000");
}' />
<i class="chatSprite chatSend" data-bind="click: function() { $('.chatSend').parent().submit() }"></i>
</form>
</div>
</div>
</script>
如您所见,我已经尝试了所有可能的聚焦领域的方法,但似乎都没有奏效。有什么建议吗?
最佳答案
我认为您的问题很可能是您的“发送”方法将异步发送回服务器,在成功回调中它可能会将消息推送到您的消息 observableArray。发生这种情况时,您的模板会重新渲染,并且您的焦点会丢失。因此,这发生在您的 $('#'+channel).focus()
调用之后,因为发送是异步完成的。
没有看到你的发送功能就无法确定。
一种选择是将“ channel ”作为另一个参数传递给“发送”函数,然后在将消息推送到消息 observableArray 后的 AJAX 请求的成功回调中,根据 channel 设置焦点。
关于javascript - 如何自动聚焦一个领域?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5237624/