Question

我刚刚开始尝试学习如何制作Google Chrome扩展程序，这对我来说有点棘手，因为我对网络开发的经验很少。我正在用这个小项目蘸我的脚趾：D

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

我想每隔x分钟发送一次通知。我在上面链接的示例网站中使用了Drink Water Event Popup示例的帮助。因此，一个给你3个按钮，15分钟和30分钟，以及.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);

我无法在任何地方找到任何关于如何根据输入文本字段内的数字设置分钟数的答案。

我非常感谢任何我可以看到的资源或答案或示例!!

谢谢

Answer 1

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

＆＃13;

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)

＆＃13;

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

＆＃13;

Answer 2

您必须使用javascript（document.getElementById(“input”);）访问输入，然后使用input.value获取包装盒中的内容。

当我按下“设置”按钮时，如何从输入字段设置值

2 个答案: