使用JS时表单输入字段中未保留用户输入值
使用JS时表单输入字段中未保留用户输入值
提问于 2019-04-06 08:51:51
我有一个表单，它有一个输入字段：
<input type="text" class="my-form" placeholder="0" maxlength="10" value="50">当前该值为50。当我手动(使用键盘)输入一个不同的值时，例如: 20，然后按TAB键或单击网页上的任意位置，该值将被处理(例如:它可能会乘以2，这发生在按下提交按钮之前)。这可以很好地工作。
当我尝试使用JS更改该值时(在控制台中)：
document.querySelector('.my-form').value = 20;输入字段框被更新为20 (到目前为止还好)，但是在此之后，当我手动按TAB或单击网站上的任何位置时，什么都没有发生(不像我手动输入值时)，当我手动单击输入字段时，值从20更改为50，就好像JS仍然具有旧值一样，这让我有理由相信我使用JS更改为的新值(20)只是显示，而不是由JS存储。
摘要:输入值只是显示在文本字段中，JS并没有维护/保存/保存输入值，当我单击submit时，输入值将更改为旧值并提交该值，而不是新值。
回答 1
Stack Overflow用户
发布于 2019-04-06 09:24:40
检查你的其他代码，它看起来你的问题是他们的副作用。
这个demo可以工作：
function setValue(){
document.querySelector('.my-form').value = 20;
}
function getValue(){
console.log(document.querySelector('.my-form').value);
}
document.querySelector('#btnSet').addEventListener('click',setValue,false);<form onsubmit="getValue(); return false;">
<input type="text" class="my-form" placeholder="0" maxlength="10" value="50">
<input type="button" id="btnSet" value="set 20 Unit">
<input type="submit" id="btnSubmit" value="Submit">
</form>
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/55544913
复制相关文章
相似问题
腾讯云开发者
