我正在为一个简单的计算器编写代码。我的大多数按钮似乎正在工作并正确调用函数,但由于某些原因,我的明确函数没有被调用。我的按钮和输入栏的HTML是:
<p id="input" style="border:1px solid black" style="width:100px"><br></p>
<table>
<tr>
<td><button style="width:100%">m+</button></td>
<td><button style="width:100%">m-</button></td>
<td><button style="width:100%">mc</button></td>
<td><button style="width:100%" onclick='memory("mr")'>mr</button></td>
<td><button onclick="clear()" style="width:100%">c</button></td>
</tr>
<tr>
<td><button onclick="addChar('7')" style="width:100%">7</button></td>
<td><button onclick="addChar('8')" style="width:100%">8</button></td>
<td><button onclick="addChar('9')" style="width:100%">9</button></td>
<td><button onclick="setOperator('/')" colspan="2" style="width:200%">/</button></td>
</tr>
<tr>
<td><button onclick="addChar('4')" style="width:100%">4</button></td>
<td><button onclick="addChar('5')" style="width:100%">5</button></td>
<td><button onclick="addChar('6')" style="width:100%">6</button></td>
<td><button onclick="setOperator('*')" colspan="2" style="width:200%">*</button></td>
</tr>
<tr>
<td><button onclick="addChar('1')" style="width:100%">1</button></td>
<td><button onclick="addChar('2')" style="width:100%">2</button></td>
<td><button onclick="addChar('3')" style="width:100%">3</button></td>
<td><button onclick="setOperator('-')" colspan="2" style="width:200%">-</button></td>
</tr>
<tr>
<td><button style="width:100%">+/-</button></td>
<td><button onclick="addChar('0')" style="width:100%">0</button></td>
<td><button onclick="addChar('.')" style="width:100%">.</button></td>
<td><button onclick="calculate()" style="width:100%">=</button></td>
<td><button onclick="setOperator('+')" style="width:100%">+</button></td>
</tr>
</table>
然后这些按钮调用各自的功能:
<script>
var str = "";
var operand1 = 0;
var operand2 = 0;
var op = "";
var mem = 0;
var input = document.getElementById("input");
function addChar(char) {
str += char;
input.innerHTML = str;
}
function clear() {
str = "";
input.innerHTML = "<br>";
}
function setOperator(operator) {
op = operator;
operand1 = str;
str = "";
input.innerHTML = "<br>";
}
function calculate() {
operand2 = str;
if (op === "+")
{
str = ((+operand1) * 10 + (+operand2) * 10)/10;
}
else if (op === "-")
{
str = (operand1 - operand2);
}
else if (op === "*")
{
str = (operand1 * operand2);
}
else if (op === "/")
{
str = (operand1 / operand2);
}
input.innerHTML = str;
}
</script>
标有&#34; c&#34;的按钮应该调用我的函数&#34; clear()&#34;,但是&#34; onclick&#34;事件似乎永远不会发生。我很有可能只有一些错误,我找不到经验。任何帮助表示赞赏。
答案 0 :(得分:2)
工作解决方案:http://jsfiddle.net/b9h7L3av/
需要重命名clear()函数。
function clearAll() {
str = "<br>";
input.innerHTML = str;
}
答案 1 :(得分:0)
内联onclick处理程序期望在设置之前加载该函数。我假设你在js之前加载html。 如果没有,那么它希望该函数成为全局对象的一部分,即窗口。
尝试像这样分配你的功能:
addEventListener
使用var interstitialReady = false;
// update the state when ad preloaded
document.addEventListener('onAdLoaded', function(e){
if(e.adType == 'interstitial') {
interstitialReady = true;
}
});
// when dismissed, preload one for next show
document.addEventListener('onAdDismiss', function(e){
if(e.adType == 'interstitial') {
interstitialReady = false;
AdMob.prepareInterstitial({
adId:admobid.interstitial,
autoShow:false
});
}
});
setInterval(function(){
if(interstitialReady) AdMob.showInterstitial();
}, 2*60*1000);
// preload the first ad
AdMob.prepareInterstitial({
adId:admobid.interstitial,
autoShow:false
});
方法分配点击处理程序通常会更好。
答案 2 :(得分:0)
当您使用带有名为clear()
的已使用定义函数的内联事件处理程序时,您会遇到一个模糊的JavaScript怪癖。有一个document.clear()
函数,在内联JavaScript的上下文中,碰巧在作用域链中首先被调用,因此这是clear()
调用所调用的函数,而不是全局window.clear()
调用的函数。功能。
您可以将clear()
来电替换为alert(clear === document.clear);
alerts true来证明这一点。
您可以通过明确限定呼叫来解决问题,即window.clear()
而不是clear()
,或者重命名该功能。但是,应该提到的是,您应该考虑使用纯JavaScript事件处理程序注册来替换内联事件处理程序,这被认为是更好的,因为它更有效地将表示与逻辑分开。