答题 js 效果运用

涉及知识点：for循环、if判断

代码示例：

html:

<div>1.下类不算编程的是?<div>
   <lable for="h">A、html</lable>
   <input type="radio" id="h" name="title" value="a"><br>
   <lable for="c">B、c语言</lable>
   <input type="radio" id="c" name="title" value="b"><br>
   <lable for="j">C、javascript</lable>
   <input type="radio" id="j" name="title" value="c"><br>
   <lable for="p">D、php</lable>
   <input type="radio" id="p" name="title" value="d">
   <p><input type="button" onclick="myFunction()" style="background:green;color:white;-webkit-border-radius:5px;pading:2px 4px;" value="提交"></p>
</div></div>

js:

function myFunction(){
   //定义答案
   var val = "a";

   //获取元素(为数组形式)
   var radio = document.getElementsByName('title');

   //判断表单是否有没选择
   var obj = 0; //定义一个空值
   for(var i = 0; i < radio.length; i++){
        //全部循环获取表单判断是否有选中
        if(radio[i].checked){
            //选择则改变obj的值
	    obj = obj+1;
        }
   }

   //判断obj的值不等于0的时候
   if(obj != 0){
        for(var i = 0; i < radio.length; i++){
	    //判断选中的表单
	    if(radio[i].checked == true){
		//判断值是否与答案 val 相同
		if(radio[i].value == val){
		    alert("答对了");
		}else{
		    alert("答错了");
		}
	    }
	}
   }else{
	alert("请选择一个答案！");
   }		
}

本文完 END

@本文作者: Cosplay，转载请注明来自Cosplay-前端笔记

本文地址：https://cosplay.wodemo.com/entry/342123