首頁 > web前端 > js教程 > JS取得form中radio和buttons的選取值

JS取得form中radio和buttons的選取值

小云云
發布: 2018-03-07 13:54:04
原創
2472 人瀏覽過

在JS中取得到form表單的radiobuttons的選取值其實跟普通的radiobutton的方法是一樣的。常用的radiobutton會要求設定radiobutton的name屬性和type屬性,然後根據這兩個屬性進行查找,如下:

1 <br/>2         <input name="radio" type="radio" checked="checked" value="男"/>男3        
 <input name="radio" type="radio" value="女"/>女4        
  <br/><br/><br/>5         
  <label id="message">哈哈哈哈</label>
登入後複製

然後在JS中程式碼如下:

 1  <script type="text/javascript"> 2         
 $(function(){ 3            
  $("input[name=&#39;radio&#39;]").click(function()
  { 4                 if($(this).val() == "男")
  { 5                     $("#message").show(); 6                 }
  else{ 7                     $("#message").hide(); 
  8                 } 9             });
  10         })11     
  </script>
登入後複製

form表單中radiobuttons的基本設定如下:

1 <form:radiobuttons path="isall" items="${fns:getDictList(&#39;allType&#39;)}"2                                
itemLabel="label" itemValue="value"3                               
 htmlEscape="false" class="" onclick=""/>
登入後複製

這裡沒有明確的給出radio的name和type,要去頻道這兩個屬性只需要在網頁上查看原始程式碼,就可以得到它的屬性,然後寫JS即可:

 1 $(function () { 2  3            
  $("input[name=&#39;isall&#39;]").click(function () 
  { 4                 if ($(this).val() == "0") 
  { 5                     $("#usermsg").hide(); 6                 
  } else { 7                     
  $("#usermsg").show(); 8                
   } 9             });
   10        
    });
登入後複製

我這裡的操作是根據選取值的情況來顯示或隱藏一部分頁面,將需要顯示或隱藏的部分的style設為display:none即可,如:

 1  <p id="usermsg" class="control-group" style="display: none"> 2            
  <label class="control-label">用户账号:</label> 3  4            
   <p class="controls"> 5                 
   <input id="user_id" type="text" maxlength="100" name="userId" class="input-medium"/> 6                
    <shiro:hasPermission name="doctor:doctormsgpush:edit"> 7                     
    <input type="submit" value="查询用户ID" onclick="check()" 8                           
     class="btn btn-primary"/> 9                 </shiro:hasPermission>10            
      </p>11     
      </p>
登入後複製

相關推薦:

怎麼讓html的下拉式選單提交後保留選取值不回傳預設值

Jquery如何取得radio選取值的範例詳解

JS取得radio選取值實例程式碼

以上是JS取得form中radio和buttons的選取值的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板