时间戳

首页 > 解决方案 > 如何添加 CheckAll 按钮

javascript - 如何添加 CheckAll 按钮

问题描述

我正在尝试在以下内容中添加一个 CheckAll 按钮 ....尝试了几个示例，我可以显示条目，但没有任何反应。

这是我认为 checkAll 应该进入的文件。请给我一些指导，请详细说明，我花了很长时间才走到这一步。

<html>
<head>
<title>List</title>
<script language="javascript" src="client.js" type="text/javascript"></script>
<style>
.even { background-color: gainsboro; color:#101010; }
.odd { background-color: white; color:#101010; }
.even:hover {background-color: cadetblue}
.odd:hover {background-color: cadetblue}
</style>

</head>
<body>
<form name="frmUser" method="post" action="">
<div style="width:500px;">
<table border="0" cellpadding="2" cellspacing="1" width="750" class="tblListForm">
<tr class="listheader">
<td></td>
<td><b>Username</b></td>
<td><b>fqdn</b></td>
<td><b>Status</b></td>
<td><b>Created</b></td>
</tr>
<?php
$i=0;
while($row = mysqli_fetch_array($result)) {
if($i%2==0)
$classname="even";
else
$classname="odd";

?>
<tr class="<?php if(isset($classname)) echo $classname;?>">
<!-- <td><input type="radio" name="xyxy[]" value="<?php echo $row["hostid"]; ?>" ></td> -->
<td><input type="checkbox" name="xyxy[]" value="<?php echo $row["hostid"]; ?>" ></td>
<td><?php echo $row["owner"]; ?></td>
<td><?php echo $row["host"]; ?>.<?php echo $row["domain"]; ?></td>
<td><?php echo $row["status"]; ?></td>
<td><?php echo $row["timestamp"]; ?></td>
</tr>
<?php
$i++;
}
?>
<tr class="listheader">
<td colspan="4"><input type="button" name="x" value="Get"  onClick="setmyclientAction();" >
&nbsp<input type=reset value="Clear selection"> 
</td>
<input type="button" name="x" value="Get"  onClick="setmyclientAction();" >&nbsp<input 
type=reset value="Clear selection">


</tr>
</table>
</form>
</div>
</body></html>

标签： javascriptphphtml

解决方案

我认为您应该添加一个复选框，而不是创建一个按钮。并onclick选中/取消选中所有其他复选框。我创建了一个演示（php当然删除了），我也使用过jquery. 看看这是否适合你。↓↓

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<html>
<head>
<title>List</title>
<script language="javascript" src="client.js" type="text/javascript"></script>
<style>
.even { background-color: gainsboro; color:#101010; }
.odd { background-color: white; color:#101010; }
.even:hover {background-color: cadetblue}
.odd:hover {background-color: cadetblue}
</style>

</head>
<body>
<form name="frmUser" method="post" action="#">
<div style="width:500px;">
<table border="0" cellpadding="2" cellspacing="1" width="750" class="tblListForm">
<tr class="listheader">
<td><input type="checkbox" onclick="$('input[name*=\'xyxy\']').prop('checked', this.checked);"></td>
<td><b>Username</b></td>
<td><b>fqdn</b></td>
<td><b>Status</b></td>
<td><b>Created</b></td>
</tr>
<!--<?php
$i=0;
while($row = mysqli_fetch_array($result)) {
if($i%2==0)
$classname="even";
else
$classname="odd";

?>-->
<tr class="classname">

<td><input type="checkbox" name="xyxy[]" value="1>" ></td>
<td>owner</td>
<td>host domain</td>
<td>status</td>
<td>timestamp</td>
</tr>

<tr class="classname">

<td><input type="checkbox" name="xyxy[]" value="2>" ></td>
<td>owner</td>
<td>host domain</td>
<td>status</td>
<td>timestamp</td>
</tr>
<!--<?php
$i++;
}
?>-->
<tr class="listheader">
<td colspan="4"><input type="button" name="x" value="Get"  onClick="setmyclientAction();" >
&nbsp;<input type=reset value="Clear selection"> 
</td>
<input type="button" name="x" value="Get"  onClick="setmyclientAction();" >&nbsp;<input 
type=reset value="Clear selection">


</tr>
</table>
</form>
</div>
</body></html>

推荐阅读