Question

我正在尝试在文本区域中输入值并单击按钮时更新HTML5进度条的值。我假设我只会在文本区域中输入格式正确的整数。

这是html：

<textarea id="txt" cols=20 rows=1 placeholder="Enter total time"></textarea>
<button onclick="myFunction()">Save</button>
<progress id="pr"></progress>

这是javascript：

function myFunction()
{
var value = document.getElementById('txt').value;
document.getElementsByTagName("PROGRESS").setAttribute("value",value.parseInt());
};

这似乎不起作用。任何帮助表示赞赏。

PS：这是我在这里发表的第一篇文章，如何让代码变得丰富多彩？

编辑：似乎代码本身变得丰富多彩：）

Answer 1

两件事：你错过了一个范围，getElementsByTagName返回一个像对象一样的数组。

function myFunction() {
  var value = document.getElementById('txt').value;
  document.getElementsByTagName("PROGRESS")[0].setAttribute("value", value);
}

<input id="txt" placeholder="Enter total time">
<button onclick="myFunction()">Save</button>
<br/>
<progress id="pr" max="100"></progress>

Answer 2

您使用的代码错误。 value不是任何调用parseInt（）函数的对象。

使用getElementsByTagName，您将获得DOM元素的数组。以下是代码中的更改：

function myFunction()
{
var value = document.getElementById('txt').value;
document.getElementsByTagName("PROGRESS")[0].setAttribute("value",parseInt(value));
};


<textarea id="txt" cols=20 rows=1 placeholder="Enter total time"></textarea>
<button onclick="myFunction()">Save</button>
<progress id="pr"></progress>

单击按钮时HTML5进度条的动态值

2 个答案: