弱智de克星

欢迎指正

JS Radio

<html>
<body>
<h1>我是怎么样的人?</h1>
<label><input type="radio" name="myRadio" onclick="myFun()" value="1" >clever</label>
<input type="radio" name="myRadio" onclick="myFun()" value="2">smart
<input type="radio" name="myRadio" onclick="myFun()" value="3" checked="true">handsome
<input type="radio" name="myRadio" disabled="true" value="4">ugly
<p id="demo" style="color:red">你非常有眼光!</p>
<script>
function myFun()
{
    var obj=document.getElementsByName("myRadio");
    for(var i=0;i<obj.length;i++)
    {
        if(obj[i].checked)
        {
            var value=obj[i].value;
            if(value==1)
            {
                document.getElementById("demo").innerHTML="你有眼光!";
                break;
            }
            if(value==2)
            {
                document.getElementById("demo").innerHTML="你很有眼光!";
                break;
            }
            if(value==3)
            {
                document.getElementById("demo").innerHTML="你非常有眼光!";
                break;
            }           }

    }   
}
</script>
</body>
</html>

Result:
这里写图片描述
Tips:
1:The element label itself does not have an effect.But if you click text inside this element,you’ll trigger event.In other words,when the user selects the tab, the browser will automatically focus to the associated controls.In a word,if you click the text clever,the radio will also be checked,but other texts will not have same effect.
2:The attribute name let you choose only one radio at one time.All the radios can be checked
simultaneously if you miss the attribute name.

阅读更多
版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/qq_31070475/article/details/52358274
个人分类: js
上一篇some function about Date
下一篇Some tips about looping statement
想对作者说点什么? 我来说一句

没有更多推荐了,返回首页

关闭
关闭