Question

我有一个表的代码，我希望在任何地方点击某个对话框弹出。例如，如果我有

Jazz 3  4  jazzy
Ram 5 7 Ruth
John 6 88 Jujube

如果我点击88，我会在对话框中获取john的详细信息，或者如果我点击Ruth，我会获得Ram的详细信息。

代码

    <script type="text/javascript">

    $('#tableItems').on('click', 'tr', function() {
       var row = $(this).find('td:first').text();
       alert('You clicked ' + row);
    });
</script>

    <th style='width:75%;'>Janurary</th>
                        <th style='width:75%;'>February</th>
                        <th style='width:75%;'>March</th>
                        <th style='width:75%;'>April</th>
                        <th style='width:75%;'>May</th>
                        <th style='width:75%;'>June</th>
                        <th style='width:75%;'>July</th>
    while($row=pg_fetch_array($result))
{ ?>
<tr>
 <td style= "font-weight: bold; border-bottom: 3px solid"><?php echo $row['client_id'] ?></td>

    <td style="padding:0px !important; border-bottom: 3px solid">

         <span style="height:50%;width:100%;display: inline-block; background-color: #fcf8e3; font-weight: bold; padding-left:5px; padding-right:5px;font-size:14">
            <?php echo "Charges";?>
         </span>
               <span style="height:50%;width:100%;border-top:1px solid black; display: inline-block; background-color: #dff0d8; font-weight: bold;  padding-left: 5px; padding-right: 5px;font-size:14">
             <?php echo "Payments";?>
                 </span>
</td>
<?php   for ($x=1;$x<=12;$x++){
          $val=strlen($x);
         if($val<2)
         {
         $query1= "Select sum(charge_amount) from charge where client_id= '".$row['client_id']."' AND to_char(charge_entry_date,'YYYY-MM') = '".$year."-". '0'.$x."'";
         $query2= "Select sum(paid_amount) from payment where client_id = '".$row['client_id']."' AND to_char(entry_date, 'YYYY-MM') ='". $year."-". '0'.$x."'";

            }
            else
            {
    $query1= "Select sum(charge_amount) from charge where client_id= '".$row['client_id']."' AND to_char(charge_entry_date,'YYYY-MM') = '".$year."-".$x."'";
    $query2= "Select sum(paid_amount) from payment where client_id = '".$row['client_id']."' AND to_char(entry_date, 'YYYY-MM') ='". $year."-".$x."'";
}



    $result1= pg_query($conn,$query1);
        $row2=pg_fetch_array($result1);


        $result2= pg_query($conn,$query2);


        $row3=pg_fetch_array($result2);

        /////
        $val2=strlen($x-1);
        if($val2<2)
        { 

    else{


    $q= "Select sum(charge_amount) from charge where client_id= '".$row['client_id']."' AND to_char(charge_entry_date,'YYYY-MM') = '".$year."-".($x-1)."'";
        $q2= "Select sum(paid_amount) from payment where client_id = '".$row['client_id']."' AND to_char(entry_date, 'YYYY-MM') ='". $year."-".($x-1) ."'";

        } 
        $r=pg_query($conn,$q);
        $row5=pg_fetch_array($r);

        $r2=pg_query($conn,$q2);
        $row6=pg_fetch_array($r2);


        ////

 ?> 

     <td style="padding:0px !important; border-bottom: 3px solid">
     <span style="height:50%;width:100%;display: inline-block;background-color: #fcf8e3; padding-left:5px; padding-right:5px;font-size:14; white-space: nowrap">
     <?php if ($row2['sum'] == NULL)
    {
    echo "0.00";
} `else{
`


     echo number_format($row2['sum'], 2, '.', ',');

     if($x==01){
                  echo "";        }

      else if($row2['sum']>$row5['sum'])

   {

......和其他回声

Answer 1

您的jQuery似乎工作正常。我会仔细检查你的html，以确保你的所有语法都正确。

我对PHP不是很熟悉，所以我很难说出代码到底发生了什么。

但正如您在此示例中所看到的，您的jQuery代码运行正常： https://jsfiddle.net/exxtvs0g/

Answer 2

试试这个，我想这就是你想要的......

以下是代码段

＆＃13;

$(function(){
$(document).on("click","table tr td",function(){
  $(".modal").modal("show");
var curr_tr = $(this).closest("tr");
  var td_length = $(curr_tr).find("td").length;
  $("#data").empty();
  for(var i =0; i< td_length; i++)
  {
    $("#data").append($(curr_tr).find("td:eq("+i+")").html()+"  ");
  }
});
});

＆＃13;

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<table style="width:100%">
  <tr>
    <th>Firstname</th>
    <th>Lastname</th>
    <th>Age</th>
  </tr>
  <tr>
    <td>Jill</td>
    <td>Smith</td>
    <td>50</td>
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td>
    <td>94</td>
  </tr>
   <tr>
    <td>Mor</td>
    <td>Ruth</td>
    <td>10</td>
  </tr>
</table>

<div class="modal fade">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
        <h4 class="modal-title">Modal title</h4>
      </div>
      <div class="modal-body">
       <p id="data"></p>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary">Save changes</button>
      </div>
    </div><!-- /.modal-content -->
  </div><!-- /.modal-dialog -->
</div><!-- /.modal -->

＆＃13;

如何在我单击

2 个答案: