zoukankan      html  css  js  c++  java
  • select 和 radio 的选中状态

    radio:

    <script type="text/javascript">

    //判断个函数 以上 5 个Radio 那个为选中状态
    function judgeRadioClicked()
    {
                //获得 单选选按钮name集合
                var radios = document.getElementsByName("radio_tj");

               //根据 name集合长度 遍历name集合
              for(var i=0;i<radios.length;i++)
              {
                     //判断那个单选按钮为选中状态
                    if(radios[i].checked)
                      {
                            //弹出选中单选按钮的值
                           alert(radios[i].value);
                     }
              }

    }
    </script>

    select:

    首先可以响应select的onchange事件来调用JS编写的事件响应函数,如<select id="select1" name="select1" onchange="outputSelect();"><option>...</select> 

    然后编写事件响应函数: 
    如果select位于表单(form1)中,select的name为select1,则可使用如下方法: 


         //获得用户选中的项的索引 
        var index=window.document.form1.select1.selectedIndex; 


       //根据索引获得该选项的value值 
       var val=window.document.form1.select1.options[index].value; 

       如果select并非表单元素,假设select的id为select1,则如下: 
       var index=window.document.getElementById("select1").selectedIndex; 
       var val=window.document.getElementById("select1").options[index].value; 

        如果要输出选择结果,假设HTML中定义了一个<div id="output"></div>,则如下输出: 
        window.document.getElementById("output").innerText=val; 

          给出一个我写的示例: 
        function outputSelect() 
        { 
             //获取用户选中的项的索引 
            var index=window.document.getElementById("select1").selectedIndex; 


            //根据index获取选中项的value值 
           var val=window.document.getElementById("select1").options[index].value; 


             //根据index获取选中项的Text值,即在下拉列表中显示的选项文本 
               var vname=window.document.getElementById("select1").options[index].text; 

                //输出value : text 
              document.getElementById("output").innerText=val+" : "+vname; 
    }

  • 相关阅读:
    洛谷1026 统计单词个数
    洛谷1381 单词背诵
    Manacher(hdu3068最长回文)
    洛谷P1078 文化之旅
    HDU1269 迷宫城堡
    codevs1020 孪生蜘蛛
    洛谷P1027 Car的旅行路线
    楼房 洛谷1382 && codevs2995
    Picture poj1177
    排列组合
  • 原文地址:https://www.cnblogs.com/laraLee/p/6228869.html
Copyright © 2011-2022 走看看