Question

我一直在使用javascript编辑器，它在内置浏览器中工作正常但是当我在IE和Firefox中尝试它加载但是然后无法运行。

HTML如下：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>

<head>
<noscript>
<p>This page requires JavaScript. Please turn on JavaScript if your browser supports it and reload the page.</p>
</noscript>
<script type = "text/javascript" src="jscripts/pvar.js">
</script>

<title></title>

</head>

<body>
<form name="form1">
Version 2012.10.1.1a
<h2>
Panasas Sizing Form
</h2>
<br>
<table colspan='3' border='0'>
<tr>
<td align="left">&nbsp;<input type="text" name="textq1" id="dtextq1" readonly="readonly" value="How will this be sized?" style="border: 0"/>
<select name="question1" id="dquestion1" value="" onfocus="this.style.background='khaki'" onblur="this.style.background='white'" onchange="setOptions1(document.form1.question1.options[document.form1.question1.selectedIndex].value)">
<Option value=""></option>
<Option value="Capacity">Capacity</option>
<Option value="Bandwidth">Bandwidth</option>
<Option value="Both">Both</option>
</select></td>
<tr>
<td align="left" id="q1c1">&nbsp;</td>
<tr>
<td align="left" id="q2c1">&nbsp;</td>
<tr>
<td align="left" id="q3c1">&nbsp;</td>
<tr>
<td align="left" id="q4c1">&nbsp;</td>
<tr>
<td align="left" id="q5c1">&nbsp;</td>
<tr>
<td align="left" id="q6c1">&nbsp;</td>
<tr>
<td align="left" id="q7c1">&nbsp;</td>
</table>
</form>
</body>
</html>

Javascript如下：

    function setOptions1(chosen)
{
var label=document.getElementById;
var textbox1="";
var textbox2="";

if (chosen == "") {
label('q1c1').innerHTML="";
label('q2c1').innerHTML="";
label('q3c1').innerHTML="";
label('q4c1').innerHTML="";
label('q5c1').innerHTML="";
label('q6c1').innerHTML="";
label('q7c1').innerHTML="";

}
if (chosen == "Capacity") {
label('q1c1').innerHTML="How much capacity do you require?";
label('q1c1').appendChild(document.createTextNode(' '));
textbox1 = document.createElement('INPUT'); 
textbox1.type = 'text';
textbox1.value = 0;
textbox1.size = 2;
textbox1.maxLength = 4;
label('q1c1').appendChild(textbox1);
label('q1c1').appendChild(document.createTextNode(' '));
textbox2 = document.createElement('SELECT'); 
textbox2_option = document.createElement('option');
textbox2_option= new Option ('GB',1,true,false);
textbox2_option= new Option ('GiB',2,false,false);
textbox2.add(textbox2_option);
label('q1c1').appendChild(textbox2);
label('q2c1').innerHTML="Average File Size:";
label('q3c1').innerHTML="Network efficiency:";
label('q4c1').innerHTML="What price level?";
label('q5c1').innerHTML="Would you like to include an IB Router?";
label('q6c1').innerHTML="";
label('q7c1').innerHTML="";

}
if (chosen == "Bandwidth") {
label('q1c1').innerHTML="What are the bandwidth requirements?";
label('q2c1').innerHTML="Network efficiency:";
label('q3c1').innerHTML="Average File Size:";
label('q4c1').innerHTML="What price level?";
label('q5c1').innerHTML="Would you like to include an IB Router?";
label('q6c1').innerHTML="";
label('q7c1').innerHTML="";
}
if (chosen == "Both") {
label('q1c1').innerHTML="How much capacity do you require?";
label('q2c1').innerHTML="Average File Size:";
label('q3c1').innerHTML="What are the bandwidth requirements?";
label('q4c1').innerHTML="Network efficiency:";
label('q5c1').innerHTML="What price level?";
label('q6c1').innerHTML="Would you like to include an IB Router?";
label('q7c1').innerHTML="";
}

}//end function

Answer 1

问题在于这一行：

var label = document.getElementById;

将其替换为

function label(s) {
  return document.getElementById(s);
}

主机对象很挑剔 - 它们并不总是像常规函数引用一样对待。

BTW：我将您的代码剪切并粘贴到一个文件中，而不是通过Google Chrome运行。错误消息是invalid invocation，让我将label的定义替换为我的第一个调试步骤。

似乎无法弄清楚为什么InnerHTML语句不起作用

1 个答案: