我正在编写一些按钮,其onclick命令加载外部html文件并更改图像的src。但是,在浏览器中打开.html文件后,我遇到了所有以简单ASCII显示的javascript代码,显然未执行! :(
编辑修复了“脚本类型”命令的问题。现在,好像脚本本身根本没有执行。关于可能出错的任何建议?
以下是代码:
<script='javascript'>
/*image preloader*/
incompanyImage = new Image();
incompanyImage.src = " http://us.123rf.com/400wm/400/400/dotshock/dotshock1211/dotshock121100869/16581370-group-of-happy-young-business-people-in-a-meeting-at-office.jpg";
/*alt image 1: http://www.123rf.com/photo_16522931_group-of-happy-young-business-people-in-a-meeting-at-office.html */
/*img source: http://www.123rf.com/photo_16581370_group-of-happy-young-business-people-in-a-meeting-at-office.html */
grupoImage = new Image();
grupoImage.src = " http://us.123rf.com/400wm/400/400/dotshock/dotshock1209/dotshock120901786/15403105-business-people-team-group-on-a-meeting-have-success-and-make-deal.jpg";
/*img source: http://www.123rf.com/photo_15403105_business-people-team-group-on-a-meeting-have-success-and-make-deal.html */
/*alt images */
particularImage = new Image();
particularImage.src = "http://us.123rf.com/400wm/400/400/auremar/auremar1210/auremar121001327/15672624-concerned-business-associates.jpg";
/*img source: http://www.123rf.com/photo_15672624_concerned-business-associates.html */
/*alt images */
intensivoImage = new Image();
intensivoImage.src = "http://us.123rf.com/400wm/400/400/dotshock/dotshock1211/dotshock121100861/16581384-group-of-happy-young-business-people-in-a-meeting-at-office.jpg";
/*img source male: http://www.123rf.com/photo_16580996_portrait-of-a-handsome-young-business-man-on-a-meeting-in-offce-with-colleagues-in-background.html */
/*img source female: http://www.123rf.com/photo_16581362_business-woman-with-her-staff--people-group-in-background-at-modern-bright-office-indoors.html */
tecnicoImage = new Image();
tecnicoImage.src = "http://us.123rf.com/400wm/400/400/dotshock/dotshock1211/dotshock121100861/16581384-group-of-happy-young-business-people-in-a-meeting-at-office.jpg";
/*img source : http://www.123rf.com/photo_16581384_group-of-happy-young-business-people-in-a-meeting-at-office.html */
/*alt image: */
entrevistaImage = new Image();
entrevistaImage.src = "http://us.123rf.com/400wm/400/400/dotshock/dotshock1211/dotshock121100912/16581362-business-woman-with-her-staff--people-group-in-background-at-modern-bright-office-indoors.jpg";
/* img source: http://www.123rf.com/photo_16581362_business-woman-with-her-staff--people-group-in-background-at-modern-bright-office-indoors.html */
/* alt image (better): http://www.123rf.com/photo_16523034_group-of-happy-young-business-people-in-a-meeting-at-office.html */
/*http://www.123rf.com/photo_16523034_group-of-happy-young-business-people-in-a-meeting-at-office.html */
palestraImage = new Image();
palestraImage.src = "http://us.123rf.com/400wm/400/400/dotshock/dotshock1204/dotshock120400224/13112547-young-male-business-man-giving-a-presentation-at-a-meeting-seminar-at-modern-conference-room-on-a-ta.jpg";
/*img source: http://www.123rf.com/photo_13112547_young-male-business-man-giving-a-presentation-at-a-meeting-seminar-at-modern-conference-room-on-a-ta.html */
/*these are the buttons for types of english classes offered*/
functon buttonInCompany()
{
$('#desc').load('incompany.html');
document.images["midimg"].src = incompanyImage.src;
}
functon buttonGrupo()
{
$('#desc').load('grupo.html');
document.images["midimg"].src = grupoImage.src;
}
functon buttonParticular()
{
$('#desc').load('particular.html');
document.images["midimg"].src = particularImage.src;
}
functon buttonIntensivo()
{
$('#desc').load('intensivo.html');
document.images["midimg"].src = intensivoImage.src;
}
function buttonEntrevista()
{
$('desc').load('entrevista.html');
document.images["midimg"].src = entrevista.html;
}
functon buttonTecnico()
{
$('#desc').load('tecnico.html');
document.images["midimg"].src = tecnicoImage.src;
}
function buttonPalestra()
{
$('#desc').load('palestra.html');
document.images["midimg"].src = palestraImage.src;
}
</script>
现在是HTML。
<div>
<p style="text-align: center;"><img name="midimg" width="233" height="350" class="art-lightbox" src="images/Fotolia_5170186_X-01.jpg"><br></p>
</div>
<div>
<p class="desc" name="desc">hasdf</p>
</div>
<div class="art-button" onClick:"buttonParticular()">Aulas Particulares</div>
<div class="art-button" onClick:"buttonGrupo()">Aulas em Grupo</div>
<div class="art-button" onClick:"buttonInCompany()">Aulas in-Company</div>
<div class="art-button" onClick:"buttonIntensivo()">Aulas Intensivos</div>
<div class="art-button" onClick:"buttonEntrevista()">Aulas para Entrevista</div>
<div class="art-button" onClick:"buttonTecnico()"> Aulas sobre sua Area</div>
<div class="art-button" onClick:"buttonPalestra()">Palestras</div>
我做错了什么?
先谢谢。
答案 0 :(得分:1)
问题(正如其他人已评论过,但未作为答案发布)是您的开场<script='javascript'>
。你在寻找:
<script type='text/javascript'>
另外:您的一些function
声明拼写错误'functon'
您应该使用onclick
而不是=
:
<div onclick="...">
答案 1 :(得分:0)
只需将<script='javascript'>
更改为<script type='javascript'>
即可。由于script
浏览后没有空格,因此获取名为script='javascript'
的标记(对其不熟悉)而不是script
此外:
<div class="art-button" onClick:"buttonParticular()">Aulas Particulares</div>
应该是
<div class="art-button" onClick="buttonParticular()">Aulas Particulares</div>
在html中,您应该在属性名称(在您的情况下为=
)和值(onclick
)之间放置"buttonParticular()"
答案 2 :(得分:0)
我接受了大家的建议,但它仍然没有执行图像或负载。在这里它再次,浓缩,没有预装载器 - 仍然没有功能。
<script type="javascript">
function buttonInCompany()
{
$('#desc').load('incompany.html');
document.images["midimg"].src = http://cageme.herokuapp.com/css/mrcage.jpg
}
</script>
<div onClick="buttonInCompany()">Everything is cage's cage.</div>
<img name="midimg" src="http://3.bp.blogspot.com/-BdfyYy_Y0gY/UP_3y3F2RDI/AAAAAAAAC-Q/eHPCltO8bG8/s1600/TomEngelsnicolas+thing.jpg">