Question

我还是前卫的新手。我在提交 textarea 标记的更改时，正在搜索JavaScript代码的快速调试。

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

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

以下是使用Javascript的HTML代码段（我忽略了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>

第二：我也想知道如何重构此代码，以便我可以通过＆lt; textarea ＆gt;这样的方式外化此脚本。 tag不必在元素中明确设置函数 venueTextChange（） - 我想隐藏它，但对于这种情况，我认为我必须包含属性 onchange 。

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

Answer 1

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

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

您需要使用类似keyup或onInput的内容才能立即触发事件，并且是 - 为了不必调用onchange属性上的函数，您可以从另一个脚本向该元素添加一个事件监听器。

这是一个演示的小提琴：https://jsfiddle.net/25xmka43/

Answer 2

这是灵魂：只需将venueTextChange（）函数更改为val即可。

<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：提交textarea的更改不起作用

2 个答案: