一种更优雅的方式来改变我的 div 的价值？答案

【问题标题】：A More Elegant way to change the value of my div?一种更优雅的方式来改变我的 div 的价值？
【发布时间】：2011-10-14 13:52:20
【问题描述】：

好吧，我需要做的是在按下按键时更改屏幕上的一些数字，我可以让它工作，但我对此并不满意。

我有一个输入字段和一个 div，当输入字段的值发生变化时，它正在更新。我这样做是为了不受输入字段闪烁克拉等的限制。我根本不想显示输入字段，但是当我使用 CSS 或 type="hidden" 隐藏它时，它不再起作用。我试图让这个与 JS 变量一起工作，但到目前为止还没有成功。

有什么想法吗？

HTML

<html>
<head>
 <link rel="stylesheet" type="text/css" href="number.css" />
</head>

<body onLoad="focus();myText.focus();changeNumber()">

<div id='number'>

</div>

<input type="text" id="myText" value="1"/>

</body>

<footer>
<script type="text/javascript" src="number.js"></script>
</footer>

</html>

JAVASCRIPT

var myText = document.getElementById("myText");

function changeNumber(){
var userInput = document.getElementById('myText').value;
document.getElementById('number').innerHTML = userInput;
}

// Capture keyDown events
myText.onkeydown = function(e) {
// "34" is the up arrow key
if (e.keyCode == 34) {
    // increment the value in the text input
    myText.value++;
changeNumber()

// "33" is the down arrow key
} else if (e.keyCode == 33 && myText.value > 1) {
    // decrement the value in the text input
    myText.value--;
changeNumber()
}
}

这里是最终的固定代码 * 谢谢大家！ **

HTML

<html>
<head>
 <link rel="stylesheet" type="text/css" href="number.css" />
</head>

<body onLoad="focus();number.focus();changeNumber()">

<div id='number' value="1">

</div>

</body>

<footer>
<script type="text/javascript" src="number.js"></script>
</footer>

</html>

JAVASCRIPT

var i = parseInt(1);

function changeNumber(){
var userInput = i;
document.getElementById('number').innerHTML = userInput;
}

// Capture keyDown events for document
document.onkeydown = function(e) {
// "34" is the PGUp key
if (e.keyCode == 34) {
    // increment the value in the text input
    (i++);
changeNumber()

// "33" is the PGDown key
} else if (e.keyCode == 33 && i > 1) {
    // decrement the value in the text input
    (i--);
changeNumber()
}

// "66" is the b key
if (e.keyCode == 66){
window.location.reload()
} 

}

【问题讨论】：

标签： javascript html keystroke

【解决方案1】：

你的代码的问题是这样的：

myText.value--;

和

myText.value++;

myText 是一个 DOM 元素，value 属性有一个字符串，而不是整数，我建议这样做：

var i = parseInt(myText.value);
myText.value = (i++);

【讨论】：

我会看看我能用这个做什么，这是有道理的，我对 javascript 不是很好，我通常在目标 c/iphone 中编程。 :(