清除 textarea 会破坏其他 JS 功能

Question

我正在为一台可以与用户交谈的计算机建模。控制台能够在屏幕上打印一条消息并重新加载，几乎没有问题。但是，我目前有一个按钮设置为“清除”计算机屏幕上的内容——一旦按下此按钮，在重新加载页面之前，其他功能都不会起作用。

我的work so far。按几次“pwr”或“send”来重现问题。一旦按下，这两个按钮都会在屏幕上打印一条消息。如果您按“清除”，屏幕会按我的意愿清除，但两个按钮都不会再向屏幕打印消息。 .val(' ') 是否以某种方式使该字段不可编辑？

# app/assets/javascripts/app.computress.coffee

App.Computress =
    clear: ->
        $("#hm_disp_txt").val('')
    greet: ->
        App.Computress.prints("Welcome!")
    prints: (str) ->
        $("#hm_disp_txt").append(str + "\n")

$(document).on "click", "[data-behavior~=computress-listen]", =>
    App.Computress.prints("ping received")

$(document).on "click", "[data-behavior~=computress-listen-clear]", =>
    App.Computress.clear()

$(document).on "click", "[data-behavior~=computress-power]", =>
    App.Computress.greet()

$(document).on "click", "[data-behavior~=computress-reload]", =>
    location.reload()

# home.html/erb
<div id="computress">
<div id="home_console">
    <textarea id="hm_disp_txt" readonly>Zzzzzz....</textarea>
</div>
    <div id="home_input">
    <div id="hm_inp_txt">></div>
    <input type="text" id="user_inp" placeholder="...say &quot;hello&quot;?">
    <%= link_to "send", "#", data: {behavior: "computress-listen"}, id: "talkbutton", class: "comptrss_mono_txt" %>
    <%= link_to "C", "#", data: {behavior: "computress-listen-clear"}, id: "clearbutton", class: "comptrss_mono_txt" %>
    <%= link_to "pwr", "#", data: {behavior: "computress-power"}, id: "pwrbutton", class: "comptrss_mono_txt" %>
    <%= link_to "reload", "#", data: {behavior: "computress-reload"}, id: "rldbutton", class: "comptrss_mono_txt" %>
    </div>
</div>

Answer 1

我相信这是因为您混淆了.append() 和.val() ...尝试使用：

$("#hm_disp_txt").val( $("#hm_disp_txt").val() + "\n" + str );

代替：

$("#hm_disp_txt").append(str + "\n");

在您的 prints() 方法中