Question

我有一张表格如下：

<table class="table table-bordered" id="dataTable" width="100%" cellspacing="0">
    <thead>
        <tr>
            <th>Order ID</th>
            <th>Name</th>
            <th>Address</th>
            <th>Status</th>
            <th>Action</th>
        </tr>
    </thead>
    <tbody>
        <?php
        foreach ($rslt as $value) {
        ?>
            <tr>
                <td><?= $value['order_id']?></td>
                <td><?= $value['cust_name']?></td>
                <td><?= $value['address']?></td>
                <td><?= $value['st_size']?></td>
                <td class="status"><?= $value['status']?></td>
                <td><button class="btn btn-primary btn-sm btn-assign" type="button" data-id="<?=$value['order_id']?>">Assign</button></td>
            </tr>
        <?php
        } 
        ?>
    </tbody>
</table>

我想要做的是，如果$ value [＆＃39; status＆＃39;]是＆＃34;已分配＆＃34;然后我想禁用该按钮，即此td旁边。我试过以下代码。但我无法禁用按钮。

$("#dataTable tbody").find("tr").each(function() {
    var ratingTdText = $(this).find('td.status').text(); 
    if (ratingTdText == 'assigned')
        $(this).parent('tr').find(".btn-assign").prop("disabled",true);

});

Answer 1

您的按钮没有id btn-assign，它是一个类。使用.代替#。

另外，在您的情况下，$(this).parent('tr')无法找到任何内容，因为this已经是tr。

＆＃13;

$('#dataTable tbody tr').each(function() {
  if ($('.status', this).text() == 'assigned') {
    $('.btn-assign', this).prop("disabled", true);
  }
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table class="table table-bordered" id="dataTable" width="100%" cellspacing="0">
  <thead>
    <tr>
      <th>Order ID</th>
      <th>Name</th>
      <th>Address</th>
      <th>Status</th>
      <th>Action</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>a</td>
      <td>b</td>
      <td>c</td>
      <td>d</td>
      <td class="status">assigned</td>
      <td><button class="btn btn-primary btn-sm btn-assign" type="button" data-id="d">Assign</button></td>
    </tr>
  </tbody>
</table>

＆＃13;

Answer 2

要添加Zenoo所说的内容 - 当您拥有find的特定选择器时，无需致电status。始终努力做出最简单的论证形式。

if ($('.status').text() == 'assigned') {
     $('.btn-assign').prop("disabled", true);
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table class="table table-bordered" id="dataTable" width="100%" cellspacing="0">
  <thead>
    <tr>
      <th>Order ID</th>
      <th>Name</th>
      <th>Address</th>
      <th>Status</th>
      <th>Action</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>a</td>
      <td>b</td>
      <td>c</td>
      <td>d</td>
      <td class="status">assigned</td>
      <td><button class="btn btn-primary btn-sm btn-assign" type="button" data-id="d">Assign</button></td>
    </tr>
  </tbody>
</table>

Answer 3

您可以通过has和contains选择器轻松完成此操作：

＆＃13;

$('tr:has(td.status:contains(assigned)) .btn-assign').prop("disabled", true);

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table class="table table-bordered" id="dataTable" width="100%" cellspacing="0">
  <thead>
    <tr>
      <th>Order ID</th>
      <th>Name</th>
      <th>Address</th>
      <th>Status</th>
      <th>Action</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>a1</td>
      <td>b2</td>
      <td>c3</td>
      <td>d4</td>
      <td class="status">assigned</td>
      <td><button class="btn btn-primary btn-sm btn-assign" type="button" data-id="d">Assign</button></td>
    </tr>
    <tr>
      <td>a2</td>
      <td>b2</td>
      <td>c2</td>
      <td>d2</td>
      <td class="status">Not assign</td>
      <td><button class="btn btn-primary btn-sm btn-assign" type="button" data-id="d">Assign</button></td>
    </tr>
    <tr>
      <td>a3</td>
      <td>b3</td>
      <td>c3</td>
      <td>d3</td>
      <td class="status">assigned</td>
      <td><button class="btn btn-primary btn-sm btn-assign" type="button" data-id="d">Assign</button></td>
    </tr>
    <tr>
      <td>a4</td>
      <td>b4</td>
      <td>c4</td>
      <td>d4</td>
      <td class="status">Not assign</td>
      <td><button class="btn btn-primary btn-sm btn-assign" type="button" data-id="d">Assign</button></td>
    </tr>
  </tbody>
</table>

＆＃13;

注意这将选择包含字词＆＃34; td＆＃34;的任何assigned即使还有其他的话。

Answer 4

为什么要使用Javascript，你可以在PHP端修复它。

next_page_url =   response.xpath('//*[@class="js-course-pagination"]//a[contains(@aria-label,"Next")]/@href').extract_first()
if next_page_url:
    yield Request(url=next_page_url) # parse is the callback by default

根据td文本禁用表中的按钮

4 个答案: