jQuery的複選框的一些想法

Question

我嘗試做的是在我這裏查詢禁用計算的複選框我

表單代碼：

<input type="hidden" name="stud_no[]" value="<?php echo 
$row['student_no'];?>"> <input type="text" name="prelim[]" 
value="<?php echo $row['prelim_pts']?>" id="prelim_<?php echo 
$row['student_no'];?>" class="txtprelim" ></td> <td><input 
type="text" name="midterm[]" value="<?php echo 
$row['midterm_pts']?>" id="midterm_<?php echo $row['student_no'];?>" 
class="txtmidterm" ></td> <td> <input type="text" name="final[]" 
value="<?php echo $row['finals_pts']?>" id="final_<?php echo 
$row['student_no'];?>" class="txtfinal" ></td> <td> <input 
type="text" name="average[]" id="average_<?php echo 
$row['student_no']; ?>" value="<?php echo $row['average_pts']; ?>" 
readonly="readonly"> </td> <td><input type="checkbox" 
name="disable[]" value="<?php echo $row['disable_comp'];?>" 
class="dis"> </td> 

現在這裏是我的jQuery代碼：

$(document).ready(function(){ 
       p="";  m="";  f=""; 




       $(".txtprelim").keyup(function(){   var id = $(this).attr("id").replace("prelim_",""); 
       p = $("#prelim_" + id).val(); 
       m = $("#midterm_" + id).val(); 
       f = $("#final_" + id).val();   Compute(p,m,f, id);   //alert($(".txtprelim").val()); 
       }); 
      $(".txtmidterm").keyup(function(){ 
       var id=$(this).attr("id").replace("midterm_",""); 
        p = $("#prelim_" + id).val(); 
        m = $("#midterm_" + id).val(); 
        f = $("#final_" + id).val(); 

       Compute(p, m, f,id);   //alert($(".txtmidterm").val()); 
      }); 
      $(".txtfinal").keyup(function(){ 
        var id=$(this).attr("id").replace("final_",""); 
         p = $("#prelim_" + id).val(); 
         m = $("#midterm_" + id).val(); 
         f = $("#final_" + id).val(); 

        Compute(p, m, f, id); 

        //alert($(".txtfinal").val()); 

        //alert($("f").val());  }); 

     function Compute(p , m , f , studno){  // alert("p="+p+" m="+m+" 
f="+f);    var average=""; 
      average = parseFloat(p * 0.3) + parseFloat(m * 0.3)+ parseFloat(f * 0.4);    $("#average_" + 
studno).val(average.toFixed()); 

       //alert(average);  } 



        $("input[type='dis']").change (function(){ 
         var val =$(this).val(); 
         if($(this).is(':checked')) 
         { 
          alert($(this).val()); 
         } 

        }); 







       }); 

Answer 1

所以從我理解的這段代碼應該會更好。在你最後的功能中也沒有type='dis'。這是一個class

$(document).ready(function() { 
     p = ""; 
     m = ""; 
     f = ""; 

     var computeValues = function(){ 
      var id = $(this).attr("id").replace("prelim_", "").replace("midterm_", "").replace("final_", ""); 
      p = $("#prelim_" + id).val(); 
      m = $("#midterm_" + id).val(); 
      f = $("#final_" + id).val(); 
      Compute(p, m, f, id); 
     }; 

     $("input").bind('keyup', computeValues); 

     function Compute(p, m, f, studno) { 
      var average; 
      average = parseFloat(p * 0.3) + parseFloat(m * 0.3) + parseFloat(f * 0.4); 
      $("#average_" + studno).val(average.toFixed());  
     } 

     $(".dis").change(function() { 
      var val = $(this).val(); 
      if ($(this).is(':checked')) { 
       $("input").unbind('keyup', computeValues); 
      } else { 
       $("input").bind('keyup', computeValues).trigger('keyup'); 
      } 
     }); 
    }); 

而且小提琴來測試它http://jsfiddle.net/Spokey/nhcsT/

UPDATDE：

您可以在表單中添加一個<input type="hidden" id="changeme" value="0">，當用戶選擇checkbox的hidden input的值將變爲1

$(".dis").change(function() { 
       var val = $(this).val(); 
       if ($(this).is(':checked')) { 
        $("input").unbind('keyup', computeValues); 
        $("#changeme").val('1'); 
       } else { 
        $("input").bind('keyup', computeValues).trigger('keyup'); 
        $("#changeme").val('0'); 
       } 
      });