这是我的问题。当我的代码嵌入到 html 页面中的 body 标记之间时,它会按预期执行:显示 12 行文本(for 循环执行 12 次);
但是,当我将代码包含在函数中,从外部 js 文件导入它,并尝试使用 onclick 或 onsubmit 事件调用它时,它会在第一次迭代后停止。
这是嵌入在 html 文件中的代码:
var all_imgs = document.getElementsByTagName('img');
for(var i=0; i<all_imgs.length; i++){
var item = all_imgs[i].src;
var item_limit = item.length-4;
var item_limit2 = item.length-6;
var selected = item.substring(item_limit, item_limit2);
if (selected == 'on') {
document.write('image ' + i + ' with url : ' + item + ' is ');
document.write('chosen');
document.write('<br>');
}
else {
document.write('image ' + i + ' with url : ' + item + ' is ');
document.write('not chosen');
document.write('<br>');
}
}
和输出:
image 0 with url : www.../thumb2_on.jpg is CHOSEN
image 1 with url : www.../thumb2_off.jpg is NOT CHOSEN
image 2 with url : www.../thumb2_off.jpg is NOT CHOSEN
image 3 ...
.
.
.
image 11 with url : www.../thumb2_on.jpg is CHOSEN
这是外部js文件中的代码:
function selectedImages(){
var all_imgs = document.getElementsByTagName('img');
for(var i=0; i<all_imgs.length; i++){
var item = all_imgs[i].src;
var item_limit = item.length-4;
var item_limit2 = item.length-6;
//document.write(item_limit);
//document.write(item_limit2);
var selected = item.substring(item_limit, item_limit2);
if (selected == 'on') {
document.write('image ' + i + ' with url : ' + item + ' is ');
document.write('chosen');
document.write('<br>');
}
else {
document.write('image ' + i + ' with url : ' + item + ' is ');
document.write('not chosen');
document.write('<br>');
}
}
}
html 文件中的 onclick 事件:
<a href="#" onclick="javascript:selectedImages();">test</a>
或
<form action="#" method="post" onsubmit="javascript:selectedImages();">
和打印输出:
图片 0 的网址为:www.../thumb2_on.jpg 已选择
最佳答案
这是因为您在页面加载后使用document.write
。它将用新内容替换当前页面,因此当您进入循环中的第二次迭代时,页面中不再有任何图像。
关于JavaScript。当包含在函数中时,我的 for 循环在一次迭代后停止,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7385567/