为什么单击带有Jquery ajax响应的update div上的按钮时不起作用?

您好,我是Jquery新手,我希望一旦用户选择一个项目,我就会显示一个表,其中包含用户可以修改的信息。我希望当他点击“修改器”按钮时,表格会自动更新。

我使用php获取表格,并使用Jquery更新div内容:

$("#upd_pr").html(data);

这工作得很好,但一旦我点击按钮,它就不起作用了? 在我看来 $("#upd_pr").html(data); 让按钮不起作用,但我不知道如何解决这个问题,请有人帮忙。

这是我的php文件:

//这就是我在适当的div上使用Jquery所追求的 $(“#upd\U pr”)。html(数据); :

<?php
require_once("C:/wamp/www/Mini_Prj/controllers/mainController.php");
 if((isset($_POST['abrv1']))){
   $abrv1=$_POST['abrv1'];
   $bqs1=MainController::getTarifBqCompare($abrv1);
  $i=0;
   echo '<h3>Gestion et tenue de compte:<h3>';
   $bq1=$bqs1->fetch();
   fillHead($bq1,"prest1");
   fillTable($bq1,$i);
   $i++;
   while ( ($bq1=$bqs1->fetch()) )
    {
      if (strstr($bq1['type'],"Monétique"))
       break;
      else
      {
        fillTable($bq1,$i);
        $i++;
      }
    }
    echo '</tbody >';
    echo '</table >';
   echo '<h3>Opération de paiement:<h3>';
   fillHead($bq1,"prest2");
   $i=0;
   fillTable($bq1,$i);
   $i++;
    while ( ($bq1=$bqs1->fetch()) )
   {
     if (strstr($bq1['type'],"Opération de paiement"))
      break;
    else
    {
        fillTable($bq1,$i);
        $i++;
    }
   }
   echo '</tbody >';
   echo '</table >';
   echo '<h3>Opération de paiemen</h3>';
    fillHead($bq1,"prest3");
    $i=0;
   fillTable($bq1,$i);
   $i++;
   while ( ($bq1=$bqs1->fetch()) )
   {
       fillTable($bq1,$i);
       $i++;
   }
   echo '</tbody >';
   echo '</table >';
 }

   function fillHead($bq1,$idtab)
   {
     echo"
      <table class='tableau table-bordered' id='$idtab'>
       <thead>
       <tr>
        <th style='display:none'>idbq</th>
        <th style='display:none'>idp</th>
         <th> Prestation</th>
         <th>Tarif</th>
         <th>Option(gratuit,An,ttc..)<th>
          <thModifier<th>
       </tr>
       </thead>
       <tbody >";
   }
   function fillTable($bq1,$i)
   {
     echo"
     <tr>
     <td style='display:none'>".$bq1['idb']."</td>
     <td style='display:none'>".$bq1['idp']."</td>
     <td>".$bq1['nomp']."</td>
     <td contenteditable='true'>".$bq1['tarif']."</td>
     <td contenteditable='true'>".$bq1['opt']."</td>
     <td> <button id='modifpr$i' class='btn btn-info modif_prst' name='button'>Modifier</button></td> 
     </tr>
     ";
   }

下面是jquery文件,它允许将这些表放在“upd\u pr”div中:

//这很好用

$("#afichprst").click(function () {
  if(abr1===undefined)
  {
    alert("Choisir une banque d'abord");
  }
    else {
      $.post(basUrl+'views/component/prest_bq.php',
        {
          abrv1:abr1,
        }, function(data) {
           $("#upd_pr").html(data);
       });
    }
});

//问题是:一旦我点击按钮,它什么也不做:

$(".modif_prst").click(function () {
  $choix=confirm("voulez vous vraiment sauvegarder les modifications");
  if ($choix)
  {
    var idbn=($(this).parent().parent().find('td:eq(0)').html());// the value in the 1st column.
    var idprs=($(this).parent().parent().find('td:eq(1)').html());
    var trf=($(this).parent().parent().find('td:eq(3)').html());
    var opttr=($(this).parent().parent().find('td:eq(4)').html());
    console.log(idbn);
    console.log(idprs);
    console.log(trf);
    console.log(opttr);
   }
});

下面是生成的html:

<h3>Modifier les prestations d'une banque: </h3>
<div class="updTarif">
  <form  method="post">
    <div class="input-group">
      <div class="input-group-btn">
        <div class="btn-group">
          <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"><span id="modifprst">Choisir une banque</span><span class="caret"></span></button>
          <ul id="udateprest" class="dropdown-menu">
            <?php
              $rows=MainController:: getBanque();
             while ($row =$rows->fetch())
             {
               if($row['supr']!=1)
                echo '<li><a>'.$row['abrvb'].'</a></li>';
             }
            ?>
          </ul>
        </div>
      </div>
    <input type="button" id="afichprst" class="btn btn-info" name="filter" value="Afficher">
  </div>
  </form>
<!--here is where i put the tables-->
  <div id="upd_pr">

  </div>
</div>