javascript - 我目前正在尝试将任务添加到数组后清除输入字段
问题描述
在将任务添加到数组后,我目前正在尝试清除输入字段。我知道这将非常简单,但对于我的生活,我似乎无法找出解决方案。任何帮助将不胜感激。谢谢。
这是我的代码:
HTML:
<body>
<form action="#" method="post" id="theForm">
<fieldset><legend>Enter an Item To Be Done</legend>
<div>
<label for="task">Task</label>
<input type="text" name="task" id="task" required>
</div>
<div>
<input type="submit" value="Add It!" id="submit" value="reset form">
</div>
<div id="output"></div>
</fieldset>
</form>
</body>
</html>
JavaScript:
var tasks = [];
function addTask() {
'use strict';
var task = document.getElementById('task');
var output = document.getElementById('output');
var message = '';
if (task.value) {
tasks.push(task.value);
message = '<h2>To-Do</h2>';
message += '<ol><li>';
message += tasks.join('</li><li>');
message += '</li></ol>';
output.innerHTML = message;
}
return false;
}
function init() {
'use strict';
document.getElementById('theForm').onsubmit = addTask
frm.submit();
frm.reset();
return false;
}
window.onload = init;
解决方案
只需通过添加 task.value=''; 清除任务字段的值即可
这是完整的工作代码。
HTML
<form action="#" method="post" id="theForm">
<fieldset><legend>Enter an Item To Be Done</legend>
<div>
<label for="task">Task</label>
<input type="text" name="task" id="task" required>
</div>
<div>
<input type="submit" value="Add It!" id="submit" value="reset form">
</div>
<div id="output"></div>
</fieldset>
</form>
</body>
</html>
JavaScript:
var tasks = [];
function addTask() {
'use strict';
var task = document.getElementById('task');
var output = document.getElementById('output');
var message = '';
if (task.value) {
tasks.push(task.value);
message = '<h2>To-Do</h2>';
message += '<ol><li>';
message += tasks.join('</li><li>');
message += '</li></ol>';
task.value='';
output.innerHTML = message;
}
return false;
}
function init() {
'use strict';
document.getElementById('theForm').onsubmit = addTask
frm.submit();
frm.reset();
return false;
}
window.onload = init;
推荐阅读
- c++ - (反)序列化枚举类
- amazon-web-services - 尽管 CloudWatch 代理正在运行,但缺少 CloudWatch 日志组
- database - MongoDB 如何从 $lookup 远程集合中 $project(限制字段)?
- javascript - ConstantSourceNode 设置的振荡器频率错误
- jquery - 如何在列表框中选择一个值并将其与其 optgroup 标签克隆到另一个列表框
- python - 如何使小部件随 PyQt5 中的窗口缩放?
- clojure - 在 Clojure 中使用 Java 哈希图
- machine-learning - Keras 中两次损失的总和(感知和 MSE)
- android - 访问 zzbgl 并覆盖已弃用的 API 时出错
- javascript - 使用 node.js 更正了大型 RESTful API 的可扩展结构