Javascript: 提交文本区域的更改无效

Question

我仍然是前端方面的菜鸟。我正在搜索 中 JavaScript 代码的快速调试，提交对 textarea 标签 的更改。

我用浏览器控制台调试了它，但还没有弄清楚它是如何运行不正常的。 所需的行为应该是 Change 按钮最初是隐藏的，然后当用户开始更改文本区域中的内容时，该按钮就会出现。并且在点击按钮后，它保留了更改。

我试图查找与此行为相关的类似错误，但这些错误既不 JavaScript 也不与我的完全相关。

这里是 HTML 以 Javascript 为特色的片段（我暂时忽略 CSS 创建的演示文稿）：

<form>
    <input type="button" value="Change" id="submitChange" disabled> 
       <textarea id="textChange" rows="10" cols="30" onchange="venueTextChange();"> Write something here </textarea>
        <script>
            function venueTextChange(){
                        var val document.getElementById("textChange").disabled;
                        document.getElementById("submitChange").disabled = !val; 
                    };
    </script>
</form>

2nd：我也想知道如何重构这段代码，以便我可以通过 <textarea> 标签不必在元素中显式设置函数 venueTextChange() - 我想隐藏它，但对于这种情况，我想我必须包含属性onchange。

也许，外部 .js 脚本中的 .addEventListener('onchange',... ) 之类的东西可以工作吗？

Answer 1

部分问题是 onChange 事件仅在元素失去焦点时触发，即当用户更改文本并模糊字段时：

https://www.w3schools.com/jsref/event_onchange.asp

您需要使用 keyup 或 onInput 之类的东西才能立即触发事件，是的 - 为了不必调用 [=13= 上的函数] 属性，您可以从另一个脚本向元素添加事件侦听器。

这里有一个fiddle来演示：https://jsfiddle.net/25xmka43/

Answer 2

这是灵魂：只需将 venueTextChange() 函数 !val 更改为 false。

<form>
    <input type="button" value="Change" id="submitChange" disabled> 
       <textarea id="textChange" rows="10" cols="30" onchange="venueTextChange()"> Write something here </textarea>
        <script>
            function venueTextChange(){
                        document.getElementById("submitChange").disabled = false; 
                    };
    </script>
</form>

Javascript: 提交文本区域的更改无效

Javascript: Submit the change for the textarea doesn't work

html

javascript

textarea