所以我对Java脚本很陌生;我正努力学习它,但是这对我来说很困难,尤其是因为我是从OOP的角度来看(C ++ / Java)。无论如何,我正在构建一个计算器,我的问题是我试图将单个全局变量设置为长引用。这就是我的意思。
这是我试图使单个全局变量工作而不是每次都编写(document.form.textview.value)的尝试。
1. var number = document.form.textview.value;
2. var number = newFunction();
function newFunction() {
return document.form.textview.value;
}
3. i also tried using document.getelementbyID and queryselector but none of them worked.
我所拥有并且正在工作:-
function insert(num) { // inserts a number into the textbox or form
document.form.textview.value = document.form.textview.value + num;
}
function equal() { // calculates numbers
var exp = document.form.textview.value;
if (exp) {
document.form.textview.value = eval(exp);
}
}
function Squareroot() {
document.form.textview.value =
eval(Math.sqrt(document.form.textview.value));
}
如您所见,我必须每次都写“ document.form.textview.value”才能使其正常工作,我希望有一个全局变量为我做这件事。
这就是我想要的:-
var number = document.form.textview.value;
function insert(num) {
return number+num;
}
function equal() {
if (number) {
eval(number);
}
}
function Squareroot() {
eval(Math.sqrt(number));
}
html:-
<form name="form">
<input class="textview" name="textview">
<table>
<caption>
<h1>↻</h1>
</caption>
<tr>
<td onclick="Clearview()">C</td>
<td>←</td>
<td onclick="Takepercentage('')">%</td>
<td onclick="insert('/')">/</td>
</tr>
<tr>
<td onclick="insert('.')">.</td>
<td onclick="exponents()">x<sup>2</sup></td>
<td onclick="Squareroot()">√</td>
<td onclick="insert('*')">*</td>
</tr>
<tr>
<td onclick="insert(6)">6</td>
<td onclick="insert(7)">7</td>
<td onclick="insert(8)">8</td>
<td onclick="insert('-')">-</td>
</tr>
<tr>
<td onclick="insert(3)">3</td>
<td onclick="insert(4)">4</td>
<td onclick="insert(5)">5</td>
<td onclick="insert('+')">+</td>
</tr>
<tr>
<td onclick="insert(0)">0</td>
<td onclick="insert(1)">1</td>
<td onclick="insert(2)">2</td>
<td onclick="equal()">=</td>
</tr>
</table>
</form>
答案 0 :(得分:0)
您可以使用onkeyup
事件监听器来更新全局变量。这样一来,只要您想引用globalVal
,就可以得到正确的值。这也称为单向绑定。也就是说,无论何时更改输入值,全局变量都会得到更新,但反之则不会。在双向绑定中,对全局变量或输入所做的更改将导致它们都被更新。
var globalVal = "";
function update(val) {
globalVal = val;
console.log(globalVal);
}
<input id="textview" onkeyup="update(this.value)" class="textview" name="textview">
答案 1 :(得分:0)
DOM非常类似于您可能熟悉的任何其他OOP系统。您可以很容易地引用document.form.textview
,作为您可以通过访问或更改其value
属性来更改的对象。但是,如果您创建对该属性的引用,则获取或设置该属性只会更改引用,而不更改基础对象。
认为它类似于
var r = new Rectangle(5, 3);
r.area() //=> 15
r.width //=> 5
r.width + 7 //=> 12, but doesn't change the rectangle.
因此,通过在希望使用number.value
的地方使用number
并将number
设置为document.form.textview
,您应该可以使事情正常进行。
const number = document.form.textview;
function insert(num) {
return number.value += '' + num;
}
function equal() {
if (number.value) {
eval (`number.value = ${number.value}`);
}
}
function Squareroot() {
number.value = Math.sqrt(number.value);
}
<form name="form">
<input class="textview" name="textview">
<table>
<caption>
<h1>↻</h1>
</caption>
<tr>
<td onclick="Clearview()">C</td>
<td>←</td>
<td onclick="Takepercentage('')">%</td>
<td onclick="insert('/')">/</td>
</tr>
<tr>
<td onclick="insert('.')">.</td>
<td onclick="exponents()">x<sup>2</sup></td>
<td onclick="Squareroot()">√</td>
<td onclick="insert('*')">*</td>
</tr>
<tr>
<td onclick="insert(6)">6</td>
<td onclick="insert(7)">7</td>
<td onclick="insert(8)">8</td>
<td onclick="insert('-')">-</td>
</tr>
<tr>
<td onclick="insert(3)">3</td>
<td onclick="insert(4)">4</td>
<td onclick="insert(5)">5</td>
<td onclick="insert('+')">+</td>
</tr>
<tr>
<td onclick="insert(0)">0</td>
<td onclick="insert(1)">1</td>
<td onclick="insert(2)">2</td>
<td onclick="equal()">=</td>
</tr>
</table>
</form>
答案 2 :(得分:-1)
您编写的代码是正确的,您只应确保在所有页面之后,debody结束标记之前导入脚本。 或者,您可以使用 var number; window.onload = function(){number = document.form.textview.value; } 然后照常使用