想学人家做一个单选框的图片按钮，点击却没有反应。大晕，求指正！

pantheon2008 2011-09-07 02:41:23
本人初学php，使用了wamp。被要求做个投票系统，前台的水平却很有限。radio单选框的投票按钮，想做成图片按钮，按照网上的javascript办法http://blog.sina.com.cn/s/blog_5ee2f3730100ec55.html做
点击没有反应，求指正！






<html>

	<head>

		<meta http-equiv = "content-type" content = "text/html" charset = "gb2312" >

		<title>楼盘投票系统_Page1</title>

	<style type= "text/css">

		.h1{font-family:"微软雅黑";font-size:25px}

	</style>

	</head>

	



	<body>

		<script language = "JavaScript">

			function mysid(sid)

				{

					var omlg = document.getElementsByTagName('img');

					for(i = 0;i<omlg.length;i++)

					{

						if(omlg[i].id==sid)

							{

								omlg[i].previoussibbling.previoussibbing.checked = true;

								omlg[i].style.border= '2px solid #FF6600';

							}

						else

							{

								omlg[i].style.border = '2px solid #FFFFFF';

							}

					}

					

				}

		</script>

		<div   align= "center "   valign= "top"  margin:-280px style= "display:inline-table;align=center;width=900px;height:110px;padding:20px;background-



color:#F6FFD2"><font face = "微软雅黑"size = 7>2011标杆楼盘评选</font>

		</div>

		<br>

		<br>

		

		<div align="left" ><font face = "微软雅黑" size = "6" color = "DA0025" ><b>某某路沿线</b></font></div> 

		<br>

		<br>

		<form action = "vote2.php" method = "post" name = "votefm1">

			<table align = "left" valign = "top" width = "840" height = "210" cellspace = 0 cellpadding = 2 class="h1" >

				<tr>

					<td width = "280" valign = "top" height = "35"><input type = "radio" name = "radiono1" value = "j1"><b>某某某某城



   </b><img id = "jp1"src="http://img2081.poco.cn/mypoco/myphoto/20110906/16/5636976620110906164630040.png" width="80" height="30" border="0" onclick = 



"mysid(this.id)" /></td>



					<td width = "280" valign = "top" height = "35"><input type = "radio" name = "radiono2" value = "j2"><b>某某某某二期



  </b><img id = "jp2"src="http://img2081.poco.cn/mypoco/myphoto/20110906/16/5636976620110906164630040.png" width="80" height="30" border="0" onclick = "mysid



(this.id)" /></td>



					<td width = "280" valign = "top" height = "35"><input type = "radio" name = "radiono3" value = "j3"><b>某某壹号



    </b><img id = "jp3"src="http://img2081.poco.cn/mypoco/myphoto/20110906/16/5636976620110906164630040.png" width="80" height="30" border="0" onclick 



= "mysid(this.id)" /></td>



				</tr>

				<tr>

					<td width = "280" valign = "top" height = "35"><input type = "radio" name = "radionob1" value = "k1"><b>某某城



          </b><img id = "kp1"src="http://img2081.poco.cn/mypoco/myphoto/20110906/16/5636976620110906164630040.png" width="80" 



height="30" border="0" onclick = "mysid(this.id)" /></td>

					<td width = "280" valign = "top" height = "35"><input type = "radio" name = "radionob2" value = "k2"><b>某某时代



         </b><img id = "kp2"src="http://img2081.poco.cn/mypoco/myphoto/20110906/16/5636976620110906164630040.png" width="80" 



height="30" border="0" onclick = "mysid(this.id)" /></td>

					<td width = "280" valign = "top" height = "35"><input type = "radio" name = "radionob3" value = "k3"><b>某某某某



    </b><img id = "kp3"src="http://img2081.poco.cn/mypoco/myphoto/20110906/16/5636976620110906164630040.png" width="80" height="30" border="0" onclick 



= "mysid(this.id)" /></td>

				</tr>

			</table>							

					

		</form>







	</body>

</html>
...全文
150 5 打赏 收藏 转发到动态 举报
写回复
用AI写文章
5 条回复
切换为时间正序
请发表友善的回复…
发表回复
pantheon2008 2011-09-08
  • 打赏
  • 举报
 回复
谢谢大家，我发现好像是previousSibling是大小写敏感的把S大写，好像就行了。
MuBeiBei 2011-09-07
  • 打赏
  • 举报
 回复 
<html>

    <head>

        <meta http-equiv = "content-type" content = "text/html" charset = "gb2312" >

        <title>楼盘投票系统_Page1</title>

    <style type= "text/css">

        .h1{font-family:"微软雅黑";font-size:25px}

    </style>

    </head>

    



    <body>

        <script language = "JavaScript">

            function mysid(sid)

                {

                    var omlg = document.getElementsByTagName('img');

                    for(i = 0;i<omlg.length;i++)

                    {

                        if(omlg[i].id==sid)

                            {

                                omlg[i].parentNode.getElementsByTagName('input')[0].checked = true;

                                omlg[i].style.border= '2px solid #FF6600';

                            }

                        else

                            {

                                omlg[i].style.border = '2px solid #FFFFFF';

                            }

                    }

                    

                }

        </script>

        <div   align= "center "   valign= "top"  margin:-280px style= "display:inline-table;align=center;width=900px;height:110px;padding:20px;background-



color:#F6FFD2"><font face = "微软雅黑"size = 7>2011标杆楼盘评选</font>

        </div>

        <br>

        <br>

        

        <div align="left" ><font face = "微软雅黑" size = "6" color = "DA0025" ><b>某某路沿线</b></font></div> 

        <br>

        <br>

        <form action = "vote2.php" method = "post" name = "votefm1">

            <table align = "left" valign = "top" width = "840" height = "210" cellspace = 0 cellpadding = 2 class="h1" >

                <tr>

                    <td width = "280" valign = "top" height = "35"><input type = "radio" name = "radiono1" value = "j1"><b>某某某某城



   </b><img id = "jp1"src="http://img2081.poco.cn/mypoco/myphoto/20110906/16/5636976620110906164630040.png" width="80" height="30" border="0" onclick = 



"mysid(this.id)" /></td>



                    <td width = "280" valign = "top" height = "35"><input type = "radio" name = "radiono2" value = "j2"><b>某某某某二期



  </b><img id = "jp2"src="http://img2081.poco.cn/mypoco/myphoto/20110906/16/5636976620110906164630040.png" width="80" height="30" border="0" onclick = "mysid



(this.id)" /></td>



                    <td width = "280" valign = "top" height = "35"><input type = "radio" name = "radiono3" value = "j3"><b>某某壹号



    </b><img id = "jp3"src="http://img2081.poco.cn/mypoco/myphoto/20110906/16/5636976620110906164630040.png" width="80" height="30" border="0" onclick 



= "mysid(this.id)" /></td>



                </tr>

                <tr>

                    <td width = "280" valign = "top" height = "35"><input type = "radio" name = "radionob1" value = "k1"><b>某某城



          </b><img id = "kp1"src="http://img2081.poco.cn/mypoco/myphoto/20110906/16/5636976620110906164630040.png" width="80" 



height="30" border="0" onclick = "mysid(this.id)" /></td>

                    <td width = "280" valign = "top" height = "35"><input type = "radio" name = "radionob2" value = "k2"><b>某某时代



         </b><img id = "kp2"src="http://img2081.poco.cn/mypoco/myphoto/20110906/16/5636976620110906164630040.png" width="80" 



height="30" border="0" onclick = "mysid(this.id)" /></td>

                    <td width = "280" valign = "top" height = "35"><input type = "radio" name = "radionob3" value = "k3"><b>某某某某



    </b><img id = "kp3"src="http://img2081.poco.cn/mypoco/myphoto/20110906/16/5636976620110906164630040.png" width="80" height="30" border="0" onclick 



= "mysid(this.id)" /></td>

                </tr>

            </table>                            

                    

        </form>







    </body>

</html>
pantheon2008 2011-09-07
  • 打赏
  • 举报
 回复
<script language = "JavaScript">
function myFun(sid)
{
alert(sid);
var omlg = document.getElementsByTagName('img');
for(var i = 0;i<omlg.length;i++)
{
if(omlg[i].id==sid)
{
document.write(omlg[i].id);
omlg[i].previoussibling.previoussibling.checked = true;

omlg[i].style.border= '2px solid #FF6600';
}
else
{
omlg[i].style.border = '2px solid #FFFFFF';
}
}

}
</script>



加入了document.write(omlg[i].id)

选中的图片的id 值 显示正确，alert(sid) if(omlg[i].id==sid) document.write(omlg[i].id) 和alert(sid) 值相同，证明 onclick 传值 和getElementsByTagName('img')都是没有问题的。

似乎问题在对<input type = "raido">的checked 属性的设定上。

继续求高手指正啊!
pantheon2008 2011-09-07
  • 打赏
  • 举报
 回复
[IMG]http://img2081.poco.cn/mypoco/myphoto/20110907/15/5636976620110907154922060.png[/IMG]

谢谢，1楼，我似乎明白点儿一楼的意思了，alert 信息 显示的是 img标签的 id= "jp1" 的jp1 ，这个是不是说img标签的 onclick事件是有作用的，已经把参数传过来啦？

哦，对了，我的浏览器是IE9和360安全浏览器，是不是传说中的IE9和javascript兼容不太好啊。
001007009 2011-09-07
  • 打赏
  • 举报
 回复 


           function mysid(sid)

                {

				alert(sid)

                    var omlg = document.getElementsByTagName('img');

                    for(i = 0;i<omlg.length;i++)

                    {

                        if(omlg[i].id==sid)

                            {

                                omlg[i].previousSibling.previousSibling.checked = true;

                                omlg[i].style.border= '2px solid #FF6600';

                            }

                        else

                            {

                                omlg[i].style.border = '2px solid #FFFFFF';

                            }

                    }

                    

                }


楼主 试试
零基础新手如何用快马平台轻松搭建你的第一个樱桃主题网站
本文面向零基础新手，详细讲解如何利用快马（InsCode）在线平台快速搭建一个静态樱桃主题网站。涵盖HTML结构搭建（Header/Nav/Main/Footer）、CSS样式美化（Flexbox布局、响应式设计）、JavaScript简单交互（图片切换）、浏览器调试技巧及一键部署流程。重点突出Web开发三要素——HTML（结构）、CSS（表现）、JS（行为）的协同实践，强调无需本地环境配置即可完成编码、预览与发布。
java上下载不了jdk_新手想学java，到哪里下载jdk？我在甲骨文官网下载jdk下载不了。...
本文详细指导了如何从Oracle官网下载并安全安装JDK 1.8版本，包括Windows 64位包的选择，以及安装过程中自动添加环境变量的说明。重点讲解了配置环境变量的必要性和步骤，确保读者顺利完成JDK的初次安装和环境设置。
别再死记硬背代码了！用App Inventor拖拽式开发你的第一个安卓App（附完整项目文件）
本文介绍使用MIT App Inventor进行可视化安卓应用开发的完整流程，涵盖环境配置、界面设计、逻辑块编程、实时测试（AI伴侣/模拟器/APK打包）及项目优化。重点突出拖拽式组件操作、事件驱动逻辑搭建与无需编码的交互实现，适用于编程初学者快速构建可安装的互动App。
PyQt6零基础入门：用AI写出第一个GUI程序
本文介绍如何利用InsCode(快马)平台结合AI快速生成PyQt6图形界面程序，无需本地环境配置。通过自然语言描述即可实时生成并预览GUI代码，简化学习流程，帮助新手避开安装、调试等常见痛点，实现从零到交互式窗口的十分钟快速入门。
牛逼，我用Python实现哈哈镜捉弄女友，女友气的拉黑了我
本文介绍了如何用Python实现哈哈镜的图像扭曲效果，包括放大和缩小两种模式。通过坐标映射公式和程序代码，将图片进行变形处理。读者可以获取源码并自行调整参数，制作有趣的哈哈镜图片。
JavaScript

87,990

社区成员

224,684

社区内容

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今

加载中

查看更多榜单
社区公告
暂无公告

试试用AI创作助手写篇文章吧

+ 用AI写文章