div不更新使用jquery

這裏是代碼當我進入房間容量（比如說：20）在各自的div它給出了20個容量中呈現的不同分支的細節。但是當我修改任何先前輸入的強度的改變也不會在所需的divdiv不更新使用jquery

<html> 
    <head> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js">     </script> 
    <link rel = "stylesheet" type = "text/css" href = "style.css" /> 

    <script> 
     $(document).ready(function(){ 
     var x=2; 
     var rem=0; 


     $('#add').click(function(){ 
      var maxfields=50; 

      if(x<=maxfields) 
      {  
       $('#more').append('<br><div id="p1">Room '+x+': <input type="text" name="room[]" maxlength="10"> Strength '+x+': <input type="text" name="stre[]" class="room" min="1" max="36"><div id="div'+x+'">'+x+'</div></div></br>'); 
      x++; 
      } 
      else 
      { 
       alert('you reached the max limit'); 
      } 

      }); 

     }); 
     </script> 
    <style> 
     input 
     { 
     height:30px; 
     } 
     #add 
     { 
     background-color:#ffffff; 
     font-family:arial; 
     border-radius:5px; 
     border-collapse:collapse; 
     border:1px solid #d6d6d6; 
     height:30px; 
     } 
     td 
     { 
     height:30px; 
     width:125px; 
     text-align:center; 
     font-weight:bold; 
     } 

     </style> 
    </head> 
    <body> 
     <?php 
     include('connect.php'); 
     $year=$_POST['yr']; 
     $sem=$_POST['sm']; 
     $date=$_POST['dt']; 
     $course=$_POST['crs']; 
     $session=$_POST['ss']; 
     $reg=$_POST['reg']; 

     session_start(); 
     $_SESSION['yr']=$year; 
     $_SESSION['sm']=$sem; 
     $_SESSION['dt']=$date; 
     $_SESSION['crs']=$course; 
     $_SESSION['ss']=$session; 
     $_SESSION['rg']=$reg; 


     $sql="select * from seating where year='$year' and sem='$sem' and course='$course' and session='$session' and reg='$reg' and date='$date'"; 
     $query=mysql_query($sql); 
     $count=mysql_num_rows($query); 
    ?> 

    <center><table border='1'> 
     <tr><td>Total Strength</td><td>Remaining</td></tr> 
    <tr><td><?php echo"$count";?></td><td><div id="rem"></div></td></tr> 
    </table></center> 


    <br></br> 
    <div class='disp'> 
    <button id="add">Add Room</button><br></br> 
     <form method="post" action="rooms_post.php" target="_parent"> 
    <div id="p1">Room 1: <input type="text" name="room[]" maxlength="10"> Strength 1: <input type="text" name="stre[]" class="room" min="1" max="36">  <div id="div1">This is div1</div></div><br> 
    <div id="more"></div></div><br> 
     <input type="submit" name="submit" value="submit" class="btn-success" disabled="disabled" /> 
     </form> 
    </div> 

    <script> 
     var rem=0; 
     var tot=<?php echo $count; ?>; 
     $("#rem").html(tot).val() 

     $(document).on("change",".room",function(){ 

       var sum = 0; 
       var k=0; 

       $(".room").each(function(){ 

        k=k+1;  
        sum += +$(this).val(); 
        var cap=$(this).val(); 
        var start=sum-cap+1;  
        var end=sum; 
        alert(k); 
        $.ajax({ 
         type:'POST', 
         url:'disp.php', 
         data:'start_id='+start+'&end_id='+end, 
         success:function(gethtml) 
        { 
         $('#div'+k+').html(gethtml);     
        } 
       }); 

      }); 

       if(sum%4==0) 
       { 

        rem=tot-sum; 

         $("#rem").html(rem).val() 

         if(rem==0) 
         { 
          $("#add").attr("disabled", true); 
          $(".btn-success").attr("disabled", false);  
          $("#rem").css("background-color", "#ffa5a5"); 
         } 
         else if(rem<0) 
         { 
          alert('Capacity exceeded the remaining'); 
          $(".btn-success").attr("disabled", true);  
          $("#add").attr("disabled", true);  
         } 
         else 
         { 
          $("#add").attr("disabled", false); 
          $(".btn-success").attr("disabled", true); 
          $("#rem").css("background-color", "#a9fc97");  
         } 
        } 
        else 
        { 

         alert('Capacity must be multiple of 4'); 
         $(".btn-success").attr("disabled", true); 
         $("#add").attr("disabled", true); 
        } 
        }); 

        </script> 

      </body> 
     </html>

反映和另一個程序disp.php在這裏給出

 <html> 
     <head> 

     </head> 

    <?php 

     include('connect.php'); 

     $start=$_POST['start_id']; 
     $end=$_POST['end_id']; 

     $sql="select branch,count(*) as ct from seating where id between $start and $end group by branch"; 
     $query=mysql_query($sql); 

     while($row=mysql_fetch_array($query)) 
     { 
      $br=$row['branch']; 
      $ct=$row['ct']; 

      echo"$br -> $ct,";   
     } 


     ?> 
     </html>

來源

2017-08-30 PAVAN

你'變種的多個版本rem;' - 一個是全球性的，一個是準備好文件的地方，你可能想解決這個問題。我會把你所有的js放在一起，這樣你不會得到像這樣的錯誤，這使得它更容易維護 – Pete

如果你移動'$（'＃''）。append .....'等等到else語句，它將新數據附加到'＃more'？這會告訴你這是否是if語句的錯誤。 – denski

你也可以'$（'＃more'）。append（'test text'）;'看看是否簡化它也可以。 – denski

變化的更改功能

的$（document）。在（「變」，「房間」，函數（）{

  var sum = 0; 
      var k=0; 

      $(".room").each(function(){ 

       k=k+1;  
       sum += +$(this).val(); 
       var cap=$(this).val(); 
       var start=sum-cap+1;  
       var end=sum; 
       alert(k); 
       $.ajax({ 
        type:'POST', 
        url:'disp.php', 
        data:'start_id='+start+'&end_id='+end, 
        success:function(gethtml) 
       { 
        $('#div'+k).html(gethtml);     
       } 
      }); 

     });

來源

2017-08-30 09:44:12

div不更新使用jquery

回答

相關問題