Question

我在html页面中放置一段php代码。我正在使用href，但链接不起作用。这是我的html + php代码片段：

<div class="panel-body">
    <div class="row">
        <div class="col-md-12 space20">
           <button class="btn btn-green add-row">
             Add New <i class="fa fa-plus"></i>
           </button>
        </div>
    </div>
    <div class="table-responsive">
        <table class="table table-striped table-hover" id="sample_2">
    <?php 
      $servername = "localhost";
      $username = "hevak_neshat"; 
      $password = "shir moz peste";
      $dbname = "hevak_android_api";
    // Create connection 
      $conn = new mysqli($servername, $username, $password, $dbname);
                                                                      // Check connection
      if ($conn->connect_error){
         die("Connection failed: " . $conn->connect_error); 
      } 
      $sql = "SELECT * FROM beacons";
      $result = $conn->query($sql);  
      if($result -> num_rows > 0)
      {
           echo "<thead>
                   <tr><th>Major number</th>
                       <th>Minor number</th>
                       <th>Client</th>
                       <th>Location</th>
                       <th>Link to ad</th>
                       <th>Attachment</th>
                       <th>Edit</th>
                   </tr> ;</thead>";
           echo "<tbody>";
           while($row = $result -> fetch_assoc())
           {
             echo "<tr><td>" .$row["major"]. "</td><td>" .$row["minor"]. "</td><td>" .$row["client"]. "</td><td>" .$row["geolocation"]. "</td><td>" .$row["linktoadd"].  "</td><td>" .$row["attacment"] . "</td><td>"; 
             echo  "<a href=\"#\" class =\"edit-row\" >";
             echo  "Edit";
             echo  "</a></td>";
             echo "</tr>";  
           }
           echo "</tbody></table>";
       } else {
           echo "no results";
       }

＆GT;

以下是我的.js代码中与html相关的部分：

$('#sample_2').on('click', '.edit-row', function(e) {
        e.preventDefault();
        if (actualEditingRow) {
            if (newRow) {
                oTable.fnDeleteRow(actualEditingRow);
                newRow = false;
            } else {
                restoreRow(oTable, actualEditingRow);

            }
        }
        var nRow = $(this).parents('tr')[0];
        editRow(oTable, nRow);
        actualEditingRow = nRow;

    });
    var oTable = $('#sample_2').dataTable({
        "aoColumnDefs" : [{
            "aTargets" : [0]
        }],
        "oLanguage" : {
            "sLengthMenu" : "Show _MENU_ Rows",
            "sSearch" : "",
            "oPaginate" : {
                "sPrevious" : "",
                "sNext" : ""
            }
        },
        "aaSorting" : [[1, 'asc']],
        "aLengthMenu" : [[5, 10, 15, 20, -1], [5, 10, 15, 20, "All"] // change per page values here
        ],
        // set the initial value
        "iDisplayLength" : 10,
    });
    $('#sample_2_wrapper .dataTables_filter input').addClass("form-control input-sm").attr("placeholder", "Search");
    // modify table search input
    $('#sample_2_wrapper .dataTables_length select').addClass("m-wrap small");
    // modify table per page dropdown
    $('#sample_2_wrapper .dataTables_length select').select2();
    // initialzie select2 dropdown
    $('#sample_2_column_toggler input[type="checkbox"]').change(function() {
        /* Get the DataTables object again - this is not a recreation, just a get of the object */
        var iCol = parseInt($(this).attr("data-column"));
        var bVis = oTable.fnSettings().aoColumns[iCol].bVisible;
        oTable.fnSetColumnVis(iCol, ( bVis ? false : true));
    });
};
return {
    //main function to initiate template pages
    init : function() {
        runDataTable_example1();
        runDataTable_example2();
    }
};

我的确切问题是当我删除php部分＆＃34;编辑＆＃34;是可点击的，并且工作正常。但是当我放置php以便我能够获取我的数据库数据时，＆＃34;编辑＆＃34;仍然是一个链接，但当你点击它没有任何反应。我找不到这个问题的原因

更新：这是我的浏览器提供的html：

<div class="panel-body">
                                        <div class="row">
                                            <div class="col-md-12 space20">
                                                <button class="btn btn-green add-row">
                                                    Add New <i class="fa fa-plus"></i>
                                                </button>
                                            </div>
                                        </div>
                                        <div class="table-responsive"> 
                                        <table class="table table-striped table-hover" id="sample_2">

                                <thead> 
                                                    <tr>
                                                        <th>Major number</th>
                                                        <th>Minor number</th>
                                                        <th>Client</th>
                                                        <th>Location</th>
                                                        <th>Link to ad</th>
                                                        <th>Attachment</th>
                                                        <th>Edit</th>

                                                    </tr> 
                                                </thead><tbody><tr><td>2</td><td>5</td><td>noxel</td><td>16253</td><td>www.noxel.com</td><td>test</td><td><a href='#' class ='edit-row' >Edit<script>
$(document).on("click","edit-row",function(event){

alert("m here");
});
</script></a></td></tr><tr><td>7</td><td>9</td><td>nox</td><td>123456</td><td>www.digikla.com</td><td>jhhfdbc</td><td><a href='#' class ='edit-row' >Edit<script>
$(document).on("click","edit-row",function(event){

alert("m here");
});
</script></a></td></tr><tr><td>0</td><td>0</td><td>fgfh</td><td>645312</td><td>wwwwwwwwwwwww</td><td>wwwwwwwww</td><td><a href='#' class ='edit-row' >Edit<script>
$(document).on("click","edit-row",function(event){

alert("m here");
});
</script></a></td></tr></tbody>
                                            </table>                                            

                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>


                        <!-- end: PAGE CONTENT-->
                    </div>

                </div>
                <!-- end: PAGE -->
            </div>

Answer 1

您无需在script中撰写php-loop。另请注意，".edit-row"是非"edit-row"
类的有效选择器

不要忘记阻止<a>元素的默认行为。使用Event.preventDefault()

在关闭正文（script）标记之前，将</body>置于右边。

试试这个：

＆＃13;

$(document).on("click", ".edit-row", function(event) {
  event.preventDefault();
  alert("m here");
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<div class="panel-body">
  <div class="row">
    <div class="col-md-12 space20">
      <button class="btn btn-green add-row">
        Add New <i class="fa fa-plus"></i>
      </button>
    </div>
  </div>
  <div class="table-responsive">
    <table class="table table-striped table-hover" id="sample_2">

      <thead>
        <tr>
          <th>Major number</th>
          <th>Minor number</th>
          <th>Client</th>
          <th>Location</th>
          <th>Link to ad</th>
          <th>Attachment</th>
          <th>Edit</th>

        </tr>
      </thead>
      <tbody>
        <tr>
          <td>2</td>
          <td>5</td>
          <td>noxel</td>
          <td>16253</td>
          <td>www.noxel.com</td>
          <td>test</td>
          <td><a href='#' class='edit-row'>Edit</a>
          </td>
        </tr>
        <tr>
          <td>7</td>
          <td>9</td>
          <td>nox</td>
          <td>123456</td>
          <td>www.digikla.com</td>
          <td>jhhfdbc</td>
          <td><a href='#' class='edit-row'>Edit</a>
          </td>
        </tr>
        <tr>
          <td>0</td>
          <td>0</td>
          <td>fgfh</td>
          <td>645312</td>
          <td>wwwwwwwwwwwww</td>
          <td>wwwwwwwww</td>
          <td><a href='#' class='edit-row'>Edit</a>
          </td>
        </tr>
      </tbody>
    </table>

  </div>
</div>

＆＃13;

Fiddle here

Answer 2

尝试用`

替换你的js代码函数$('#sample_2').on('click', '.edit-row', function(e) {

$（document）.on（＆＃39;点击＆＃39;，＆＃39;＃sample_2 a.edit-row＆＃39;，function（e）{

或简单

$（文件）.on（＆＃39;点击＆＃39;，＆＃39; a.edit-row＆＃39;，功能（e）{

这可能适用于您的

Answer 3

我非常确定委派的事件处理程序会有所帮助：http://api.jquery.com/on/

尝试以下更改：

    NSMutableAttributedString *text2 =
    [[NSMutableAttributedString alloc]
         initWithAttributedString: self.btnFriendName.titleLabel.attributedText];
    [text2 addAttribute:NSForegroundColorAttributeName
                 value:[UIColor redColor]
                 range:NSMakeRange(1, 2)];
    [self.btnFriendName setAttributedTitle:text2 forState:UIControlStateNormal];

Answer 4

将您的热门javascript代码更改为此并检查。

 $(document).on('click', '.edit-row', function(e) {
        e.preventDefault();
        if (actualEditingRow) {
            if (newRow) {
                oTable.fnDeleteRow(actualEditingRow);
                newRow = false;
            } else {
                restoreRow(oTable, actualEditingRow);

            }
        }
        var nRow = $(this).parents('tr')[0];
        editRow(oTable, nRow);
        actualEditingRow = nRow;
    });

href链接不起作用

4 个答案: