Fatal编程技术网

JavaScript中的函数

javascript

JavaScript中的函数,javascript,Javascript,我正在学习JS的基础知识，我写了这个脚本，但它并不像我想象的那样工作。它应该根据按钮点击的不同，在标签内部加上或减去10个值，在标签内部加上或减去10个值 <!DOCTYPE HTML> <html> <head> <title>Meter</title> <script type="text/javascript"> function f(a) { document.getElementById("prog").v

我正在学习JS的基础知识，我写了这个脚本，但它并不像我想象的那样工作。它应该根据按钮点击的不同，在标签内部加上或减去10个值，在标签内部加上或减去10个值

<!DOCTYPE HTML>
<html>
<head>
<title>Meter</title>
<script type="text/javascript">
function f(a)
{
    document.getElementById("prog").value = document.getElementById("prog").value + a;
    var t = parseInt(document.getElementById("prog"),10);
    document.getElementById("prog") = t + a;
}
</script>
</head>
<body>
<form title="Meter">
<button type="button" onClick="f(-10);" >Subtract</button>
<button type="button" onClick="f(10);" >Add</button>
<meter  min="0" max="100" value="50" id="prog">50</meter>
</form>
</body>
</html>


米
函数f（a）
{
document.getElementById（“prog”）.value=document.getElementById（“prog”）.value+a；
var t=parseInt（document.getElementById（“prog”），10）；
document.getElementById（“prog”）=t+a；
}
减去
添加
50
更改以下内容

var t = parseInt(document.getElementById("prog"),10);
到

工作版本>

您必须设置属性，而不是函数的结果。

您需要获取/设置元素的
.innerHTML

function f(a)
{
    document.getElementById("prog").value = document.getElementById("prog").value + a;
    var t = parseInt(document.getElementById("prog").innerHTML, 10);
    document.getElementById("prog").innerHTML = t + a;
}
首先，你应该描述一下我所说的不起作用的地方

我认为
标记中的值没有改变是问题所在

我的解决方案是使用innerHTML：

<!DOCTYPE HTML>
<html>
<head>
<title>Meter</title>
<script type="text/javascript">
function f(a)
{
    //changing the value
    document.getElementById("prog").value = document.getElementById("prog").value + a;
    //(next two lines) changing the innerHTML, which is the inner HTML of an element.
    var t = parseInt(document.getElementById("prog").innerHTML,10);
    //This makes t+a between 0 and 100.
    document.getElementById("prog").innerHTML = t+a<100?t+a>0?t+a:0:100;
}
</script>
</head>
<body>
<form title="Meter">
<button type="button" onClick="f(-10);" >Subtract</button>
<button type="button" onClick="f(10);" >Add</button>
<meter  min="0" max="100" value="50" id="prog">50</meter>
</form>
</body>
</html>


米
函数f（a）
{
//更改值
document.getElementById（“prog”）.value=document.getElementById（“prog”）.value+a；
//（下两行）更改innerHTML，它是元素的内部HTML。
var t=parseInt（document.getElementById（“prog”）.innerHTML，10）；
//这使得t+a介于0和100之间。
document.getElementById（“prog”）.innerHTML=t+a0？t+a:0:100；
}
减去
添加
50
在Google Chrome中，我得到了一种进度条，它工作得很好，但在Firefox IE中，我只得到了预期的INER标记值的文本显示，但功能没有预期的那样工作，它应该会更改仪表标记内的文本。t+a，我不知道在哪里可以找到更多错误。请你写下来好吗？ 
<!DOCTYPE HTML>
<html>
<head>
<title>Meter</title>
<script type="text/javascript">
function f(a)
{
    //changing the value
    document.getElementById("prog").value = document.getElementById("prog").value + a;
    //(next two lines) changing the innerHTML, which is the inner HTML of an element.
    var t = parseInt(document.getElementById("prog").innerHTML,10);
    //This makes t+a between 0 and 100.
    document.getElementById("prog").innerHTML = t+a<100?t+a>0?t+a:0:100;
}
</script>
</head>
<body>
<form title="Meter">
<button type="button" onClick="f(-10);" >Subtract</button>
<button type="button" onClick="f(10);" >Add</button>
<meter  min="0" max="100" value="50" id="prog">50</meter>
</form>
</body>
</html>