DOM对象的抉择，做一个选择题的JS
日期：2014-05-16 浏览次数：20435 次
DOM对象的选择，做一个选择题的JS
一个div里有多个text，然后text里又有input，所以我要先选中text判断是第几题，如果任何一个input被点击，那么先前隐藏的answer就会block。现在我的问题怎么分别选中text里的input。
------解决方案--------------------
window.onload=function(){
var oText=oDiv.getElementsByClassName("text");
var?oAn=document.getElementsByClassName("anwser");
for(var i=0;i<oAn.length;i++){
oAn[i].onclick = function(){
for(var j=0;j<oText.length;j++){
oText[i].style.display='none';
}
this. previousSibling.style.display='block';
}
}
}
大致这样 语法有点王忘记了
------解决方案--------------------
一个div里有多个text，然后text里又有input，所以我要先选中text判断是第几题，如果任何一个input被点击，那么先前隐藏的answer就会block。现在我的问题怎么分别选中text里的input。
dom
js
选择题
------解决方案--------------------
window.onload=function(){
var oText=oDiv.getElementsByClassName("text");
var?oAn=document.getElementsByClassName("anwser");
for(var i=0;i<oAn.length;i++){
oAn[i].onclick = function(){
for(var j=0;j<oText.length;j++){
oText[i].style.display='none';
}
this. previousSibling.style.display='block';
}
}
}
大致这样 语法有点王忘记了
------解决方案--------------------
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<style>
#div1{ width:500px; height:auto; background:#A2D0FF;}
.text{ height:100px; background:#0C3; width:500px;}
.anwser{ height:100px; background:#CF6; width:500px; display:none;}
</style>
<script>
window.onload=function()
{
var oDiv=document.getElementById("div1");
var oText=oDiv.getElementsByClassName("text");
var oAn=document.getElementsByClassName("anwser");
var index=0;
var select_arr
for(var i=0;i<oText.length;i++){
select_arr=oText[i].getElementsByTagName("input");
for(var j=0;j<select_arr.length;j++){
select_arr[j].onclick=function(){
for(var i=0;i<oText.length;i++){
if(oText[i]==this.parentNode){
index=i;
}
}
oAn[index].style.display="block";
}
}
}
}
</script>
<body>
<div id="div1"><p>This is the first question description.</p>
<div class="text">
A.one<input type="radio"/>
B.two<input type="radio"/>
C.three<input type="radio"/>
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
