当我按下“设置”按钮时如何从输入字段中设置一个值答案

【问题标题】：How to set a value from an input field when I press a "set" button当我按下“设置”按钮时如何从输入字段中设置一个值
【发布时间】：2018-03-27 20:50:57
【问题描述】：

我刚开始尝试学习如何制作 google chrome 扩展程序，这对我来说有点棘手，因为我对 Web 开发的经验很少。我只是在尝试这个小项目：D

出于我的目的，我一直使用chrome samples 来引用自己，但就输入而言，我没有运气。

我想每 x 分钟向自己发送一次通知。我在上面链接的示例网站中使用了 Drink Water Event Popup 示例的帮助。因此，它为您提供了 3 个按钮，分别为 15 分钟和 30 分钟，以及 0.01 秒的样本（因此立即通知）。

我想补充的是，可以输入“x”数字，然后按“设置”按钮，该按钮会在“x”分钟内通知您。

所以我已经添加到标签内的 .html 代码

<input id='input-text' type='text' size="1" value="0.01" />minutes

对于我的设置按钮如下：在 .js 文件中

document.getElementById('set').addEventListener('click', setAlarm); // This one

document.getElementById('sampleSecond').addEventListener('click', setAlarm);
document.getElementById('15min').addEventListener('click', setAlarm);
document.getElementById('30min').addEventListener('click', setAlarm);
document.getElementById('cancelAlarm').addEventListener('click', clearAlarm);

我只是无法在任何地方找到任何关于如何让自己能够根据输入文本字段中的数字设置分钟数的答案。

任何资源或答案或我可以查看的示例将不胜感激！

谢谢

【问题讨论】：

标签： javascript html google-chrome-extension textfield

【解决方案1】：

这应该做你想做的事。您只需要从输入 DOM 元素中提取数据。如果您使用type="text"，它不会以数字形式返回，因此您必须使用parseFloat 或parseInt

function action() {
  const minutes = document.getElementById('time').value
  const ms = minutes * 60 * 1000
  console.log(`alert in ${ms}`)
  setTimeout(() => alert('Alert!'), ms)
}

document.getElementById('set').addEventListener('click', action)

<label>Minutes</label>
<input id="time" type="number" step="0.01" required>
<input id="set" type="submit" value="Set">

【讨论】：

我不得不根据自己的情况调整它，但你基本上已经教会了我如何去做。非常感谢！

【解决方案2】：

您必须在 javascript (document.getElementById(“input”);) 中访问输入，然后使用 input.value 来获取框中的内容。

【讨论】：