我想将复选框的值放在zitplaats的标签上。有人能帮助我吗？
<html>
<head>
<title> Reserverings-formulier </title>
<style type="text/css">
</style>
<script src="<?php echo base_url().'/jquery-1.4.1.min.js'?>"> </script>
<script type ="text/javascript">
function process(){
var l = $('[name=check]:checked').length;
if(l>=1){
$('[name=check]').each(function(i,d){
if(!$(d).is(":checked")){
$(d).attr('disabled','disabled');
}
});
}else{
$('[name=check]').each(function(i,d){
$(d).removeAttr('disabled');
});
}
}
</script>
</head>
<body>
<h1> reservering </h1>
<p> vul in de onderste gegevens in. </p>
<?php echo validation_errors() ?>
<?php
echo form_open($base_url . 'User/register3');
$username = array(
'name' => 'reg_username',
'id' => 'reg_username',
'value' => ''
);
$email = array(
'name' => 'reg_email',
'id' => 'reg_email',
'value' => ''
);
$gsmnummer = array(
'name' => 'reg_gsmnummer',
'id' => 'reg_gsmnummer',
'value' => ''
);
$zitplaats = array(
'name' => 'reg_zitplaats',
'id' => 'reg_zitplaats',
'value' => ''
);
$username2 = array(
'name' => 'reg_username',
'id' => 'reg_username',
'value' => ''
);
$email2 = array(
'name' => 'reg_email',
'id' => 'reg_email',
'value' => ''
);
$gsmnummer2 = array(
'name' => 'reg_gsmnummer',
'id' => 'reg_gsmnummer',
'value' => ''
);
$zitplaats2 = array(
'name' => 'reg_zitplaats',
'id' => 'reg_zitplaats',
'value' => ''
);
$username3 = array(
'name' => 'reg_username',
'id' => 'reg_username',
'value' => ''
);
$email3 = array(
'name' => 'reg_email',
'id' => 'reg_email',
'value' => ''
);
$gsmnummer3 = array(
'name' => 'reg_gsmnummer',
'id' => 'reg_gsmnummer',
'value' => ''
);
$zitplaats3 = array(
'name' => 'reg_zitplaats',
'id' => 'reg_zitplaats',
'value' => ''
);
?>
<table>
<tr>
<td><label> Naam </label></td>
<td> <div> <?php echo form_input($username); ?></div></td>
<td><label> Naam </label></td>
<td> <div> <?php echo form_input($username2); ?></div></td>
<td><label> Naam </label></td>
<td> <div> <?php echo form_input($username3); ?></div></td>
</tr>
<tr>
<td><label>e-mail </label></td>
<td><div> <?php echo form_input($email); ?></div></td>
<td><label>e-mail </label></td>
<td><div> <?php echo form_input($email2); ?></div></td>
<td><label>e-mail </label></td>
<td><div> <?php echo form_input($email3); ?></div></td>
</tr>
<tr>
<td><label>e-mail </label></td>
<td><div> <?php echo form_input($gsmnummer); ?></div></td>
<td><label> gsm-nummer </label></td>
<td><div> <?php echo form_input ($gsmnummer2); ?> </div></td>
<td><label> gsm-nummer </label></td>
<td><div> <?php echo form_input ($gsmnummer3); ?> </div></td>
</tr>
<tr>
<td><label>zitplaats</label></td>
<td><div> <?php echo form_label($label_text='aangevinkte plaats'); ?> </div></td>
<td><label>zitplaats</label></td>
<td><div> <?php echo form_label($label_text='aangevinkte plaats'); ?> </div></td>
<td><label>zitplaats</label></td>
<td><div> <?php echo form_label($label_text='aangevinkte plaats'); ?> </div></td>
</tr>
<tr>
<td> <?php echo form_submit(array('name'=> 'verzend'), 'verzend'); ?> </td>
</tr>
</table>
<?php echo form_close(); ?>
<table>
<tr>
<th width="23" scope="col"> <input type="checkbox" name="check" value="Z01" align="center" onchange="javascript:process()"/> </th>
<th width="23" scope="col"> <input type="checkbox" name="check" value="Z02" align="center" onchange="javascript:process()"/></th>
<th width="6" scope="col"> </th>
<th width="6" scope="col"> </th>
<th width="23" scope="col"> <input type="checkbox" name="check" value="Z03" align="center" onchange="javascript:process()"/> </th>
<th width="23" scope="col"> <input type="checkbox" name="check" value="Z04" align="center" onchange="javascript:process()"/></th>
<th width="23" scope="col"> <input type="checkbox" name="check" value="Z05" align="center" onchange="javascript:process()"/></th>
<th width="23" scope="col"> <input type="checkbox" name="check" value="Z06" align="center" onchange="javascript:process()"/></th>
<th width="23" scope="col"> <input type="checkbox" name="check" value="Z07" align="center" onchange="javascript:process()"/></th>
<th width="6" scope="col"> </th>
<th width="11" scope="col"> </th>
<th width="26" scope="col"> <input type="checkbox" name="check" value="Z08" align="center" onchange="javascript:process()"/> </th>
<th width="20" scope="col"> <input type="checkbox" name="check" value="Z09" align="center" onchange="javascript:process()"/></th>
</tr>
<tr>
<th width="23" scope="col"> <input type="checkbox" name="check" value="Z10" align="center" onchange="javascript:process()"/> </th>
<th width="23" scope="col"> <input type="checkbox" name="check" value="Z11" align="center"/></th>
<th width="6" scope="col"> </th>
<th width="6" scope="col"> </th>
<th width="23" scope="col"> <input type="checkbox" name="check" value="Z12" align="center" onchange="javascript:process()"/> </th>
<th width="23" scope="col"> <input type="checkbox" name="check" value="Z13" align="center" onchange="javascript:process()"/></th>
<th width="23" scope="col"> <input type="checkbox" name="check" value="Z14" align="center" onchange="javascript:process()"/></th>
<th width="23" scope="col"> <input type="checkbox" name="check" value="Z15" align="center" onchange="javascript:process()"/></th>
<th width="23" scope="col"> <input type="checkbox" name="check" value="Z16" align="center" onchange="javascript:process()"/></th>
<th width="6" scope="col"> </th>
<th width="6" scope="col"> </th>
<th width="26" scope="col"> <input type="checkbox" name="check" value="Z17" align="center" onchange="javascript:process()"/> </th>
<th width="20" scope="col"> <input type="checkbox" name="check" value="Z18" align="center" onchange="javascript:process()"/></th>
</tr>
<tr>
<th width="23" scope="col"> <input type="checkbox" name="check" value="Z19" align="center" onchange="javascript:process()"/> </th>
<th width="23" scope="col"> <input type="checkbox" name="check" value="Z20" align="center" onchange="javascript:process()"/></th>
<th width="6" scope="col"> </th>
<th width="6" scope="col"> </th>
<th width="23" scope="col"> <input type="checkbox" name="check" value="Z21" align="center" onchange="javascript:process()"/> </th>
<th width="23" scope="col"> <input type="checkbox" name="check" value="Z22" align="center" onchange="javascript:process()"/></th>
<th width="23" scope="col"> <input type="checkbox" name="check" value="Z23" align="center" onchange="javascript:process()"/></th>
<th width="23" scope="col"> <input type="checkbox" name="check" value="Z24" align="center" onchange="javascript:process()"/></th>
<th width="23" scope="col"> <input type="checkbox" name="check" value="Z25" align="center" onchange="javascript:process()"/></th>
<th width="6" scope="col"> </th>
<th width="6" scope="col"> </th>
<th width="26" scope="col"> <input type="checkbox" name="check" value="Z26" align="center" onchange="javascript:process()"/> </th>
<th width="20" scope="col"> <input type="checkbox" name="check" value="Z27" align="center" onchange="javascript:process()"/></th>
</tr>
<tr>
<th width="23" scope="col"> <input type="checkbox" name="check" value="Z28" align="center" onchange="javascript:process()"/> </th>
<th width="23" scope="col"> <input type="checkbox" name="check" value="Z29" align="center" onchange="javascript:process()"/></th>
<th width="6" scope="col"> </th>
<th width="6" scope="col"> </th>
<th width="23" scope="col"> <input type="checkbox" name="check" value="Z30" align="center" onchange="javascript:process()"/> </th>
<th width="23" scope="col"> <input type="checkbox" name="check" value="Z31" align="center" onchange="javascript:process()"/></th>
<th width="23" scope="col"> <input type="checkbox" name="check" value="Z32" align="center" onchange="javascript:process()"/></th>
<th width="23" scope="col"> <input type="checkbox" name="check" value="Z33" align="center" onchange="javascript:process()"/></th>
<th width="23" scope="col"> <input type="checkbox" name="check" value="Z34" align="center" onchange="javascript:process()"/></th>
<th width="6" scope="col"> </th>
<th width="6" scope="col"> </th>
<th width="26" scope="col"> <input type="checkbox" name="check" value="Z35" align="center" onchange="javascript:process()"/> </th>
<th width="20" scope="col"> <input type="checkbox" name="check" value="Z36" align="center" onchange="javascript:process()"/></th>
</tr>
<tr>
<th width="23" scope="col"> <input type="checkbox" name="check" value="Z37" align="center" onchange="javascript:process()"/> </th>
<th width="23" scope="col"> <input type="checkbox" name="check" value="Z38" align="center" onchange="javascript:process()"/></th>
<th width="6" scope="col"> </th>
<th width="6" scope="col"> </th>
<th width="23" scope="col"> <input type="checkbox" name="check" value="Z39" align="center" onchange="javascript:process()"/> </th>
<th width="23" scope="col"> <input type="checkbox" name="check" value="Z40" align="center" onchange="javascript:process()"/></th>
<th width="23" scope="col"> <input type="checkbox" name="check" value="Z41" align="center" onchange="javascript:process()"/></th>
<th width="23" scope="col"> <input type="checkbox" name="check" value="Z42" align="center" onchange="javascript:process()"/></th>
<th width="23" scope="col"> <input type="checkbox" name="check" value="Z43" align="center" onchange="javascript:process()"/></th>
<th width="6" scope="col"> </th>
<th width="6" scope="col"> </th>
<th width="26" scope="col"> <input type="checkbox" name="check" value="Z44" align="center" onchange="javascript:process()"/> </th>
<th width="20" scope="col"> <input type="checkbox" name="check" value="Z45" align="center" onchange="javascript:process()"/></th>
</tr>
<tr>
<th width="23" scope="col"> <input type="checkbox" name="check" value="Z46" align="center" onchange="javascript:process()"/> </th>
<th width="23" scope="col"> <input type="checkbox" name="check" value="Z47" align="center" onchange="javascript:process()"/></th>
<th width="6" scope="col"> </th>
<th width="6" scope="col"> </th>
<th width="23" scope="col"> <input type="checkbox" name="check" value="Z48" align="center" onchange="javascript:process()"/> </th>
<th width="23" scope="col"> <input type="checkbox" name="check" value="Z49" align="center" onchange="javascript:process()"/></th>
<th width="23" scope="col"> <input type="checkbox" name="check" value="Z50" align="center" onchange="javascript:process()"/></th>
<th width="23" scope="col"> <input type="checkbox" name="check" value="Z51" align="center" onchange="javascript:process()"/></th>
<th width="23" scope="col"> <input type="checkbox" name="check" value="Z52" align="center" onchange="javascript:process()"/></th>
<th width="6" scope="col"> </th>
<th width="6" scope="col"> </th>
<th width="26" scope="col"> <input type="checkbox" name="check" value="Z53" align="center" onchange="javascript:process()"/> </th>
<th width="20" scope="col"> <input type="checkbox" name="check" value="Z54" align="center" onchange="javascript:process()"/></th>
</tr>
</table>
</body>
答案 0 :(得分：1)
此代码将按您的要求执行，但您将面临一些问题：
$(function () {
$("input:checkbox").change(function () {
if ($(this).is(":checked")) {
// Disable all checkboxes; TODO: Give the checkboxes a clearer selection scope
$("input:checkbox").attr("disabled", true);
// Leave this checkbox enabled
$(this).removeAttr("disabled");
// Set label; TODO: Give this label clearer selection scope
$("label:contains('zitplaats')").html($(this).val());
} else {
// Enable all checkboxes; TODO: Give the checkboxes a clearer selection scope
$("input:checkbox").removeAttr("disabled");
// Reset label; TODO: Give this label clearer selection scope
$("label:contains('" + $(this).val() + "')").html("zitplaats");
}
});
});
注意TODO项目。在表格中标记带有ID的复选框，这样您就可以将 $（“input：checkbox”）选择器更改为 $（“＃tableID input：checkbox”）仅将其限制为要影响的表中的复选框。给＆lt; label＆gt;需要更改ID或唯一psuedo类的内容，以便您可以更新 $（“label：contains（'zitplaats'）”）和 $（“label：contains（'” + $（this）.val（）+“'）”）可以实际选择的内容，如 $（“＃labelID”）