index.html內(nèi)容如下：

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript" src="/static/jQuery/index.js"></script>

<p>請(qǐng)輸入兩個(gè)數(shù)字</p>
<form id="formnum" action="{% url 'aptest:index' %}" >
  {% csrf_token %}
    a: <input type="text" id="a" name="a" > <br><br>
    b: <input type="text" id="b" name="b"> <br><br>

    <!--定義單選按鈕-->
    sex: <input type="radio" checked="checked" name="sex" value="man" />男
    <input type="radio" name="sex" value="woman" />女<br><br><br>

    <!--定義復(fù)選框-->
    <label><input type="checkbox" name="fruit_all" value="fruit_all" />all checked </label> <br><br>
    <label><input type="checkbox" name="fruit" value="apple" />apple </label> 
    <label><input type="checkbox" name="fruit" value="pear" />pear </label> 
    <label><input type="checkbox" name="fruit" value="watermelon" />watermelon </label> <br><br>

    <!--定義下拉列表-->
    Select one:<select id="car" name="car"> <!--index view通過(guò)該name名稱得到選擇結(jié)果-->
    <option value="Volvo">Volvo</option>
    <option value="Saab" selected="selected">Saab</option> <!--默認(rèn)選中-->
    <option value="Mercedes" disabled="disabled">Mercedes</option> <!--不可選，灰色-->
    <option value="Audi" title="Audi, your best choice!">Audi</option> <!--鼠標(biāo)放在上面出現(xiàn)提示信息-->
    </select><br>


<form id="form02" action="{% url 'aptest:index' %}" >
  {% csrf_token %}
    <!--定義復(fù)選框-->
    <label><input type="checkbox" id="ccar_all" value="c_all" />all checked </label> <br><br>
    <label><input type="checkbox" name="ccar" value="c1" />c1 </label> <br><br>
    <label><input type="checkbox" name="ccar" value="c2" />c2 </label> <br><br>
    <label><input type="checkbox" name="ccar" value="c3" />c3 </label> <br><br>

    <input type="button" id='sum' name='sum' value="cacl">
</form><br>

顯示如下：

index.js內(nèi)容如下：

$(document).ready(function(){

$('#ccar_all').click(function(){ //先通過(guò)全選復(fù)選框的click按鈕接收事件，之后才能判斷其是否被選中
    if(this.checked){
        alert(this.value); //獲取該復(fù)選框的值
        //$('#form02-checkbox).attr("checked",'true'); //單個(gè)元素設(shè)置其為選中狀態(tài)
        //$('#form02 input[name=ccar]').each(function(){this.checked=true;}); //多個(gè)元素
        $('#form02').find(':checkbox').each(function(){this.checked=true;});
    }
    else{
        $('#form02').find(':checkbox').each(function(){this.checked=false;});
    }
});


});

$('#formnum input[type=button]').click(function(){
  //判斷是否一個(gè)都沒(méi)有選中
  if($('#formnum').find('input[name=fruit]:checked').size() == 0){alert('一個(gè)都沒(méi)選中')}
});

其他：

$(document).ready(function(){

  $('p').css('color','red')
  $('.loading').css('display','none') //隱藏名為.loading的類(lèi)
  $('#car').css('color','green')
  $('#formnum input[type=button]').click(function(){
      //alert($('input:radio:checked').val()); //獲取單選按鈕的值
      //var arr=[];
      //$('input:checkbox:checked').each(function(){arr.push(this.value);}); #獲取復(fù)選框的值
      //alert(arr[0]);
      //alert($('#car').val()); //獲取下拉列表的值



    $.ajax({
      type: 'POST',
      //url: '/aptest/',
      // data:{
      //      a:$('#a').val(),
      //      b:$('#b').val()
      // },
      data:$('#formnum').serialize(),
      dataType:'json',
      success:function(response,stutas,xhr){
          //alert(response); //返回Object Object
        $('#result').html(response.r1);
        $('#result2').html(response.r2);
        //alert(stutas);
      },
      error:function(xhr,errorText,errorStatus){
        alert(xhr.status+' error: '+xhr.statusText);
      },
      timeout:500
    });
  });

$('#form02 input[type=button]').click(function(){
  //$('#form02 input[name=ccar]').attr("checked",'true'); //查找該form下所有name=ccar的元素.最好不要通過(guò)name查找，因?yàn)樗兄堤峤坏胶笈_(tái)后，還需要使用該name取出相應(yīng)的值，所以最好將checkall的name區(qū)分開(kāi)來(lái)
  //$("[name='checkbox']").removeAttr("checked");//取消選中
  //alert($('#ccar_all').is(':checked')); //判斷該復(fù)選框是否被選中

});



  $(document).ajaxStart(function(){
      $('.loading').show();
  }).ajaxStop(function(){
      $('.loading').hide();
  });

  // $('input').click(function(){ //點(diǎn)擊按鈕后再加載test.js文件，而不是全局調(diào)用
  //     $.getScript('test.js');
  // });



});

總結(jié)

以上是生活随笔為你收集整理的全选、单选的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。