如何在php中實現「select/unselect all」複選框?
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>View Users</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<style>
body {
font: normal medium/1.4 sans-serif;
}
div.greetblock, div.serverresponse {
border-collapse: collapse;
width: 100%;
margin-left: auto;
margin-right: auto;
align: center;
}
tr > td {
padding: 0.25rem;
text-align: center;
border: 1px solid #ccc;
}
tr:nth-child(even) {
background: #fff;
}
tr:nth-child(odd) {
background: #FA9A8B;
color: #fff;
}
tr#header{
background: #F78371;
}
div#norecord{
margin-top:10px;
width: 15%;
margin-left: auto;
margin-right: auto;
}
input,select{
cursor: pointer;
}
img{
margin-top: 10px;
height: 200px;
width: 300px;
}
select{
width: 200px
}
div.leftdiv{
width: 100%;
padding: 0 10px;
float: center;
border: 1px solid #ccc;
margin: 5px;
height: 320px;
text-align:center;
}
div.rightdiv{
width: 45%;
padding: 0 10px;
float: right;
border: 1px solid #ccc;
margin: 5px;
height: 320px;
text-align:center;
}
hidediv{
display: none;
}
p.header{
height: 40px;
background-color: #EB5038;
padding: 10px;
color: #fff;
text-align:center;
margin: 0;
margin-bottom: 10px;
}
textarea{
font-size: 25px;
font-weight: normal;
}
</style>
<script>
function sendMsg(){
var msgLength = $.trim($("textarea").val()).length;
var checkedCB = $("input[type='checkbox']:checked").length;
if(checkedCB == 0){
\t alert("You must select atleast one User to send message");
}else if(msgLength == 0){
\t alert("You left the message field blank, please fill it");
}else{
\t var formData = $(".wrapper").find("input").serialize() + "&imgurl="+ $("#festival").val() + "&message=" + $("textarea").val(); \t
\t $.ajax({type: "POST",data: formData, url: "processmessage.php", success:function(res){
\t \t $(".greetblock").slideUp(1000);
\t \t $(".serverresponse").prepend(res).hide().fadeIn(2000);
\t }});
}
}
$(function(){
\t $(".serverresponse").hide()
\t $("input[type='checkbox']").click(function(){
\t \t if($(this).is(':checked')){
\t \t \t $(this).parent().css("border","3px solid red");
\t \t }else{
\t \t \t $(this).parent().css("border","0px");
\t \t }
\t });
\t
\t $("div.leftdiv, div.rightdiv").hover(function(){
\t \t $(this).css("background","#FAFAFA");
\t },function(){
\t \t $(this).css("background","#fff");
\t });
\t
\t $("#festival").change(function(){
\t \t $("img").attr("src",$(this).val());
\t });
\t
\t $("#sendmsg").click(function(){
\t \t $(".serverresponse").fadeOut(300,function(){
\t \t \t $(".greetblock").fadeIn(1000);
\t \t }); \t \t
\t });
});
</script>
</head>
<body>
<?php
include_once 'db_functions.php';
$db = new DB_Functions();
$users = $db->getAllUsers();
if ($users != false)
$no_of_users = mysql_num_rows($users);
else
$no_of_users = 0; \t
?>
<?php
if ($no_of_users > 0) {
?>
<div class="greetblock">
<div class="leftdiv">
<p class="header">Select Users to whom you want to send an announcement
</p>
<table style="width:100%">
<tr id="header"><td>Id</td><td>EmailId</td><td>Send Message?</td></tr>
<?php
while ($row = mysql_fetch_array($users)) {
?>
<tr>
<td><span><?php echo $row["id"] ?></span></td>
<td><span><?php echo $row["emailid"] ?></span></td>
<td><span class="wrapper"><input type="checkbox" name="sendmsg[]" value="<?php echo $row["emailid"] ?>"/></span></td>
</tr>
<?php } ?>
</table>
</div>
<div class="leftdiv">
<p class="header">Type your message
</p>
<textarea cols="15" rows="5" value="txtarea">
</textarea>
<center>
<button onclick="sendMsg()">Send Message</button>
</center>
</div>
</div>
<div class="serverresponse hidediv">
<center><button id="sendmsg">Send Message Again</button></center>
</div>
<?php }else{ ?>
<div id="norecord">
No records in MySQL DB
</div>
<?php } ?>
</body>
</html>
上面的代碼顯示給誰我可以發送使用谷歌雲消息的消息的用戶的列表。 每個用戶都顯示在一個表格中,每個用戶都有一個複選框。 我可以選擇表中的用戶發送消息 我想爲此添加一個選擇/取消選擇複選框。 有人可以幫助我嗎?
在此先感謝。
您確定要使用PHP來選擇/取消選擇多個HTML複選框?聽起來像JavaScript是更好的解決方案。 – Mex 2015-02-08 15:36:57
看到[鏈接](http://www.plus2net.com/javascript_tutorial/checkbox-checkall.php) – Lal 2015-02-08 15:40:07