欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

jQuery實現(xiàn)遍歷復(fù)選框的方法示例

 更新時間：2017年03月06日 14:13:28   作者：翱翔天地  
這篇文章主要介紹了jQuery實現(xiàn)遍歷復(fù)選框的方法,結(jié)合實例形式分析了jQuery針對表單復(fù)選框元素的遍歷與字符串操作相關(guān)技巧,需要的朋友可以參考下

本文實例講述了jQuery實現(xiàn)遍歷復(fù)選框的方法。分享給大家供大家參考，具體如下：

1、問題背景：

這里有10個復(fù)選框，根據(jù)選擇的復(fù)選框獲取其值，并將其值用“——”連接，插入到div中

2、實現(xiàn)代碼：

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>遍歷復(fù)選框</title>
    <script type="text/javascript" src="jquery-1.7.2.min.js" ></script>
    <script>
      $(document).ready(function(){
        $("#btn").click(function(){
          var str = "";
          $("input[name='ckb']").each(function(){
            if($(this).is(":checked"))
            {
              str += "——" + $(this).val();
            }
          });
          $("#txt").html(str);
        });
      });
    </script>
  </head>
  <body>
    <div>
      <input type="checkbox" name="ckb" value="1" />1
      <input type="checkbox" name="ckb" value="2" />2
      <input type="checkbox" name="ckb" value="3" />3
      <input type="checkbox" name="ckb" value="4" />4
      <input type="checkbox" name="ckb" value="5" />5
      <input type="checkbox" name="ckb" value="6" />6
      <input type="checkbox" name="ckb" value="7" />7
      <input type="checkbox" name="ckb" value="8" />8
      <input type="checkbox" name="ckb" value="9" />9
      <input type="checkbox" name="ckb" value="10" />10<br>
      <input type="button" id="btn" value="遍歷"/>
      <div id="txt"></div>
    </div>
  </body>
</html>

3、運行效果圖：

更多關(guān)于jQuery相關(guān)內(nèi)容感興趣的讀者可查看本站專題：《jQuery form操作技巧匯總》、《jQuery操作json數(shù)據(jù)技巧匯總》、《jQuery常用插件及用法總結(jié)》、《jQuery擴展技巧總結(jié)》、《jQuery表格(table)操作技巧匯總》及《jquery選擇器用法總結(jié)》

希望本文所述對大家jQuery程序設(shè)計有所幫助。

相關(guān)文章

最新評論