Question

我正在开发一个程序，其中我使用数据表，它使用查询动态加载数据并添加两个按钮。它工作得非常好。当我单击第一个按钮时，将以模态打开图像。当我单击相同的按钮时，图像打开两次。此过程继续，因为没有时间我点击相同的按钮没有时间图像背靠背打开。我的php代码是这样的：

<div class="container-fluid">
  <div class="col-lg-12" style="margin-top:30px; ">
    <div class="panel panel-primary">
      <div class="panel-heading clickable">
        <h3 class="panel-title">District Wise Sorting List TP Scheme Details</h3>
      </div>
      <div class="panel-body" style="overflow-x:scroll">
        <table class="table table-bordered" id="tps_det">
          <thead>
            <tr class="success">
              <th>Sr ID</th>
              <th>Name</th>
              <th>District</th>
              <th>City</th>
              <th>Button</th>
              <th>Redirect</th>
            </tr>
          </thead>
          <?php do { ?>
          <tr>
            <td>
              <?php echo $row_Recordset1[ 'id']; ?>
            </td>
            <td>
              <?php echo $row_Recordset1[ 'name']; ?>
            </td>
            <td>
              <?php echo $row_Recordset1[ 'district']. "</br>" ; ?>
            </td>
            <td>
              <?php echo $row_Recordset1[ 'city']. "</br>" ; ?>
            </td>
            <td>
              <?php if( $row_Recordset1[ 'buttonoff']=='yes' ) { echo '<button type="button" id="'.$row_Recordset1[ 'name']. '" name="btn_'.$row_Recordset1[ 'name'].
              '" onClick="funct(this);"  ><img src="../data/green_circle.png" style="text-align:center;width:25px;height=25px;" /></button>'; } if( $row_Recordset1[ 'buttonoff']=='no' ) { echo '<button type="button" id="no_off" name="btn_'.$row_Recordset1[ 'name']. '" ><img src="../data/red_circle.png" style="text-align:center;width:25px;height=25px;" /></button>'; } ?>
            </td>
            <td>
              <button type="button" id="sub" name="redirect" onClick="funct(this);">Redirect</button>
            </td>
          </tr>
          <?php //$i++; } while ($row_Recordset1=p g_fetch_assoc($Recordset1)); ?>
        </table>
      </div>
    </div>
  </div>
</div>

在javascript程序中，我首先检查图像是否存在于给定的源，如果它出现然后适当的图像打开模态和图像不存在然后默认图像加载模态。我的问题是，当我点击相同的按钮时，Image应该只打开一次。

我是怎么做到的。

我的javascript代码就像这样

theTable = $('#dtble').dataTable({
  "paging": true,
  "lengthChange": true,
  "searching": true,
  "ordering": false,
  "info": true,
  "autoWidth": true
});

function funct(value) {

  var id1 = $(value).attr('id');
  var idname = $(value).attr('name');

  $('#dtble tbody').on('click', 'button', function() {

    var data = theTable.api().row($(this).parents('tr')).data();

    var name = data[1];
    var id = data[0];

    if (id1 == 'sub' && idname == 'redirect') {


      $.ajax({
        type: "POST",
        url: "../select/get_id.php",
        data: 'name=' + name,
        success: function(data1) {
          //alert(data1);
          window.location = '../index_new.php?var=' + data1 + '&name=' + name;
        }
      });
    }

    if (idname == "btn_" + name && id1 == id) {
      var image_url = "../photo/" + name + ".JPG";
      $.get(image_url)
        .done(function() {

          BootstrapDialog.show({

            title: 'Name:- ' + name,
            message: '<img class="image_nm" id="image_nm" src="../photo/' + name + '.JPG" height=800 width=500 style="margin-left:30px;"> '
          });

        }).fail(function() {

          BootstrapDialog.show({

            title: 'Name:- ' + name,
            message: '<img class="image_nm" id="image_nm" src="../photo/default.png" height=800 width=500 style="margin-left:30px;"> '
          });
        });
    }
  });
}

单击按钮时数据表中的事件处理没有多次打开图像的次数

0 个答案: