jsp中js实现点击按钮更改背景图片代码怎么写？
三个按钮，点击“按钮1” 上下两个DIV中的背景同时更换成两个不同的图片
点击“按钮2” 同上
以此类推
但是文字还在,只是背景图片改变 展开
代码如下：
<style type="text/css" media="all">
#aa{ height:300px; width:300px; margin:o auto;}
#a1{ height:250px; width:300px; border:1px solid #0099CC; color:#000000; font-size:18px;}
#a2{ height:50px; width:300px; }
</style>
<script type="text/javascript">
function bb(o){
var dom = document.getElementById("a1");
if(parseInt(o)==1){
dom.style.cssText = "background-color:#009900;";
}else if(parseInt(o)==2){
dom.style.cssText = "background-color:#FFFF00;";
}else{
dom.style.cssText = "background-color:#FF0000;";
}
}
</script>
</head>
<body>
<div id="aa">
<div id="a1">div中的字体哦</div>
<div id="a2">
<input type="button" value="点击1" onclick="bb(1)" />
<input type="button" value="点击2" onclick="bb(2)" />
<input type="button" value="点击3" onclick="bb(3)" />
</div>
</div>
</body>
补充说明：
JSP全名为Java Server Pages，中文名叫java服务器页面，其根本是一个简化的Servlet设计，它 是由Sun Microsystems公司倡导、许多公司参与一起建立的一种动态网页技术标准。JSP技术有点类似ASP技术，它是在传统的网页HTML(标准通用标记语言的子集)文件(*.htm,*.html)中插入Java程序段(Scriptlet)和JSP标记(tag)，从而形成JSP文件，后缀名为(*.jsp)。 用JSP开发的Web应用是跨平台的，既能在Linux下运行，也能在其他操作系统上运行。
function mychange(num){
document.getElementById("div1").style.backgroundImage="url("+num+".jpg)";
document.getElementById("div2").style.backgroundImage="url("+num+".jpg)";
}
</script>
</head>
<body>
<div id="div1" style="height:200px; width:200px; background:#FF0000">这是第一个div</div>
<div id="div2" style="height:200px; width:200px; background:#0000FF">这是第二个div</div>
<input type="button" value="第一个按钮" onclick="mychange(1)" />
<input type="button" value="第二个按钮" onclick="mychange(2)" />
<input type="button" value="第三个按钮" onclick="mychange(3)" />
</body>
|
广告 您可能关注的内容 |
