如果取消选中该复选框,如何禁用链接

时间:2016-07-15 05:56:04

标签: javascript jquery checkbox

如果取消选中此复选框,如何禁用链接(删除并查看)

这是我的代码

<table><form>
        <tr>
            <th></th>
            <th style="width:100px;"><center>Last Name</center></th>
            <th style="width:100px;"><center>First Name</center></th>
            <th style="width:auto;"><center>Email</center></th>
            <th style="width:100px;"><center>Birthday</center></th>
            <th style="width:auto;"><center>Action</center></th>
        </tr>
        <?php
        while($row= mysql_fetch_array($result))
        {
            echo "<tr>";
            echo "<td>";
            echo "<input type=\"checkbox\" id=\"box\">";
            echo "<td>".$row['lastname']."</td>";
            echo "<td>".$row['firstname']."</td>";
            echo "<td>".$row['email']."</td>";
            echo "<td>".$row['bdate']."</td>";
            echo "";
            echo "<td><center>";
            echo "<a href=\"delete.php?id=".$row['id']."\" style=\"text-decoration:none\" class=\"btn\" id=\"delete\">DELETE</a> ";
            echo "<a href=\"personal_information.php?id=".$row['id']."\" style=\"text-decoration:none\" class=\"btn\" id=\"view\">VIEW</a> ";
            echo "</td></center></td>";
            echo "</tr>";

        }
        ?>
    </form></table>

这是我的 jQuery脚本(例如,如果我只想禁用VIEW链接)

<script>
        jQuery('#box').click(function () {
    //check if checkbox is checked
    if (jQuery(this).is(':checked')) {

        jQuery('#view').removeAttr('disabled'); //enable input

    } else {
        jQuery('#view').attr('disabled', true); //disable input
    }
});
    </script>

如果取消选中该复选框,我想禁用每个视图并删除每行,我该怎么办?或者我的jQ​​uery错了?你能给我一个checkall框的例子吗

3 个答案:

答案 0 :(得分:0)

<input type="checkbox" id="check"/><label for="check">checkbox</label>

Google

Check this link

答案 1 :(得分:0)

无法停用主播,只能禁用与表单相关的元素(inputbuttontextarea等。)您应该删除href属性或隐藏锚元素...

&#13;
&#13;
$(function() {
  $("#chkRemove").change(function() {
    if ($(this).is(":checked")) {
      $("a").attr("href", "javascript:void(0)");
    } else {
      $("a").each(function(idx, element) {
        $(element).attr("href", $(element).data("link"));
      });
    }
  });
  
  $("#chkHide").change(function() {
    if ($(this).is(":checked")) {
      $("a").hide();
    } else {
      $("a").show();
    }
  });
});
&#13;
.links {
  padding: 20px 0;
}
.links a {
  display: block;
}
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>


<div>
  <input id="chkRemove" type="checkbox" />Remove href attribute
</div>
<div>
  <input id="chkHide" type="checkbox" />Hide anchors
</div>

<div class="links">
  <a href="http://google.com" data-link="http://google.com">Google Link</a>

  <a href="http://stackoverflow.com" data-link="http://stackoverflow.com">Stackoverflow Link</a>
</div>
&#13;
&#13;
&#13;

另外,作为旁注。切勿使用attr功能来处理复选框或单选按钮的状态。始终使用More information here功能

$(selector).prop("checked", true);

答案 2 :(得分:0)

我不太了解php,但试试这个:

....
.
.
echo "<input type=\"checkbox\" id=\"box\" onchange="myfunction()">";
echo "<td>".$row['lastname']."</td>";
echo "<td>".$row['firstname']."</td>";
echo "<td>".$row['email']."</td>";
echo "<td>".$row['bdate']."</td>";
echo "";
echo "<td><center>";
echo "<a href=\"delete.php?id=".$row['id']."\" style=\"text-decoration:none\" class=\"btn\" id=\"delete\"><input type="button" id="delete" value="Delete"></a> ";
echo "<a href=\"personal_information.php?id=".$row['id']."\" style=\"text-decoration:none\" class=\"btn\" id=\"view\"><input type="button" id="view" value="View"></a> ";
.
.
.
...

JavaScript就是这样的:

<script>
function myFunction(){
    document.getElementById('delete').disabled = !this.checked;
    document.getElementById('view').disabled = !this.checked;
}
</script>