JavaScript 代码在某些浏览器上无法运行

Question

我创建了与 facebook 添加好友发送消息列表相同的代码(提交至:)。 代码是在 FrontPage 中创建的，也在那里进行了测试，功能有限，就像 FrontPage 预览一样，并且它正在工作...... 然后在 IE 7 和 IE 8 甚至 IE 9 中测试，它也可以工作...... 还在 FireFox、Chrome 和 Safari 中进行了测试，并且它也可以工作...

然后，我将此代码发送给 friend ，他说它不起作用...... 我一遍又一遍地检查代码，但找不到什么问题......

代码信息:

topolje - 包含用户列表的 div，当您单击特定用户时，它会调用函数 addnewto('username')

howbig - 背景 div 计算新创建的用户字段的大小，因此可以调整输入字段的大小以适应用户列表和输入的字段...

newone - 输入您开始输入用户名的位置，它会显示以此开头的用户名...

getRefToDiv(id_of_element) - 在不同浏览器中通过 id 查找元素

这里是代码:

var skup = new Array();
var skup2 = new Array();

function addnewto(user)
{

var i = 777777;
var userform = '';
var k = 0;
var velicina = 23;
getRefToDiv('topolje').style.height = "23px";

for ( j = 0; j < skup.length; j++ ) {
if ( skup[j] == "" ) {
i = j;
}
else
{

userform2 = '<font id="tekst' + j + '" name="tekst' + j + '" style="background: #8BBC40; border:1px solid #808080; -moz-border-radius: 3px; border-radius: 3px; padding-left:4px; padding-right:4px; padding-top:1px; padding-bottom:1px" face="Tahoma" size="2" color="#FFFFFF">' + skup2[j] + ' |<span onclick="';
userform2 += "this.parentNode.parentNode.removeChild(getRefToDiv('tekst" + j + "-1')); this.parentNode.parentNode.removeChild(this.parentNode); skup.splice(" + j + ",1); skup2.splice(" + j + ",1); setTimeout('getsize();', 10);;";
userform2 += '" style="cursor: pointer"> x </span></font><span id="tekst' + j + '-1" name="tekst' + j + '-1">&nbsp;</span>';


var mast = getRefToDiv('howbig');
var duzina = 0;
mast.innerHTML = userform + userform2;
duzina = mast.clientWidth;

if ( duzina > 405 ) {
userform += "<br>" + userform2;
velicina += 21;
getRefToDiv('topolje').style.height = velicina + "px";
}
else
{
userform += userform2;
}

}
}

if ( i = 777777 ) {
i = skup.length;
}

skup[i] = 'tekst' + i;
skup2[i] = user;


userform2 = '<font id="tekst' + i + '" name="tekst' + i + '" style="background: #8BBC40; border:1px solid #808080; -moz-border-radius: 2px; border-radius: 2px; padding-left:4px; padding-right:4px; padding-top:1px; padding-bottom:1px" face="Tahoma" size="2" color="#FFFFFF">' + user + ' |<span onclick="';
userform2 += "this.parentNode.parentNode.removeChild(getRefToDiv('tekst" + i + "-1')); this.parentNode.parentNode.removeChild(this.parentNode); skup.splice(" + i + ",1); skup2.splice(" + i + ",1); setTimeout('getsize();', 10);";
userform2 += '" style="cursor: pointer"> x </span></font><span id="tekst' + i + '-1" name="tekst' + i + '-1">&nbsp;</span>';


var mast = getRefToDiv('howbig');
var duzina = 0;
mast.innerHTML = userform + userform2;
duzina = mast.clientWidth;

if ( duzina > 405 ) {
userform += "<br>" + userform2;
velicina += 21;
getRefToDiv('topolje').style.height = velicina + "px";
}
else
{
userform += userform2;
}



getRefToDiv('topolje').innerHTML = userform + '<input type="text" onblur="if ( this.value.length < 3 ) { proveri(0); } else { proveri(2); }" onfocus="if ( this.value.length < 2 ) { proveri(1); }" onkeyup="if ( this.value.length > 2 ) { proveri(this.value); }" style="border: 1px solid #FFFFFF; width: 10px; font-family:Verdana; font-size:10pt; color:#8BBC40;" id="newone" name="newone">';

reorder();
}


function reorder()
{

var i = 777777;
var userform = '';
var userformx = '';
var k = 0;
var velicina = 23;
getRefToDiv('topolje').style.height = "23px";


for ( j = 0; j < skup.length; j++ ) {
if ( skup[j] == "" ) {
i = j;
}
else
{

userform2 = '<font id="tekst' + j + '" name="tekst' + j + '" style="background: #8BBC40; border:1px solid #808080; -moz-border-radius: 3px; border-radius: 3px; padding-left:4px; padding-right:4px; padding-top:1px; padding-bottom:1px" face="Tahoma" size="2" color="#FFFFFF">' + skup2[j] + ' |<span onclick="';
userform2 += "this.parentNode.parentNode.removeChild(getRefToDiv('tekst" + j + "-1')); this.parentNode.parentNode.removeChild(this.parentNode); skup.splice(" + j + ",1); skup2.splice(" + j + ",1); setTimeout('getsize();', 10);;";
userform2 += '" style="cursor: pointer"> x </span></font><span id="tekst' + j + '-1" name="tekst' + j + '-1">&nbsp;</span>';


var mast = getRefToDiv('howbig');
var duzina = 0;
mast.innerHTML = userform + userform2;
duzina = mast.clientWidth;

if ( duzina > 405 ) {
userform += "<br>" + userform2;
userformx = userform2;
velicina += 21;
getRefToDiv('topolje').style.height = velicina + "px";
}
else
{
userform += userform2;
userformx += userform2;
}

}
}

getRefToDiv('topolje').innerHTML = userform + '<input type="text" onblur="if ( this.value.length < 3 ) { proveri(0); } else { proveri(2); }" onfocus="if ( this.value.length < 2 ) { proveri(1); }" onkeyup="if ( this.value.length > 2 ) { proveri(this.value); } else  { proveri(1); }" style="border: 1px solid #FFFFFF; width: 10px; font-family:Verdana; font-size:10pt; color:#8BBC40;" id="newone" name="newone">';


var mast = getRefToDiv('howbig');
var duzina = 0;

mast.innerHTML = userformx;
duzina += mast.clientWidth;
var duzina2 = 400 - duzina;
getRefToDiv('newone').style.width = duzina2 + 'px';



}

我已经研究了很长时间，但我无法弄清楚...... 如果您发现任何错误，请告诉我...

谢谢。

Answer 1

我什至不知道这在任何浏览器中是如何工作的。

这个:

if ( i = 777777 ) {
i = skup.length;
}

应该是这样的:

if (i === 777777) {
    i = skup.length;
}

这是代码中的一个常见错误，称为“意外分配”。也就是说，除非您始终希望条件 block 评估为 true，在这种情况下您的代码相当于:

i = 777777;
i = skup.length;

我确信你不是这个意思。我建议放弃 WYSIWYG 编辑器，转而使用一个好的 IDE，它可以向您指出这些事情(例如，当我将您的代码粘贴到新的空白 javascript 文件中时，NetBeans 就为我突出显示了这一行)。

而且，这只是众多问题之一。请参阅我对该问题的评论，以获取解决所有其他问题的说明。