JavaScript Tutorial/jQuery/Form CheckBox

Материал из Web эксперт
Версия от 18:52, 25 мая 2010; (обсуждение)
(разн.) ← Предыдущая | Текущая версия (разн.) | Следующая → (разн.)
Перейти к: навигация, поиск

30. Check the check box

<html>
  <head>
    <script type="text/javascript" src="js/jquery-1.3.2.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){
                $("#single").val("Single2");
                $("#multiple").val(["Multiple2", "Multiple3"]);
                $("input").val(["check1","check2", "radio1" ]);
        });
    </script>
    <style>
      .selected { color:red; }
      .highlight { background:yellow; }
    </style>    
  </head>
  <body>
    <body>
          <select id="single">
            <option>1</option>
            <option>2</option>
          </select>
          <select id="multiple" multiple="multiple">
            <option selected="selected">Multiple</option>
            <option>Multiple2</option>
            <option selected="selected">Multiple3</option>
          </select><br/>
        
          <input type="checkbox" name="checkboxname" value="check1"/> check1
          <input type="checkbox" name="checkboxname" value="check2"/> check2
          <input type="radio"  name="r" value="radio1"/> radio1
          <input type="radio"  name="r" value="radio2"/> radio2
    </body>
</html>


30. Get checkbox from form controls

<html>
  <head>
    <script type="text/javascript" src="js/jquery-1.3.2.js"></script>
    <script type="text/javascript">
    $(document).ready(function(){
        var input = $("input:checkbox");
        $("div").text(input.length);
        
        
    });
    </script>
  </head>
  <body>
     <form>
      <input type="checkbox" />
    </form>
     <div></div>
  </body>
</html>


30. Get checked checkbox

<html>
  <head>
    <script type="text/javascript" src="js/jquery-1.3.2.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){
      
              var n = $("input:checked").length;
              $("div").text(n);
          
        });
    </script>
  </head>
  <body>
    <form>
    <input type="checkbox" name="newsletter" checked="checked" />
    <input type="checkbox" name="newsletter" checked="checked"/>
  </form>
  <div></div>
  <div>
  </div>
  </body>
</html>


30. Preset checkbox

<html>
  <head>
    <script type="text/javascript" src="js/jquery-1.3.2.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){
          $("input").val(["check1","check2", "radio1" ]);
     
        });
    </script>
  </head>
  <body>
    <body>
      <input type="checkbox" name="checkboxname" value="check1"/> check1
      <input type="checkbox" name="checkboxname" value="check2"/> check2
      <input type="radio"  name="r" value="radio1"/> radio1
      <input type="radio"  name="r" value="radio2"/> radio2
  </body>
</html>
Источник — «http://wbex.ru/index.php?title=JavaScript_Tutorial/jQuery/Form_CheckBox&oldid=9682»