我是javascript / jquery和php的新手。我在php中显示表的内容。当我选择一个复选框时,我调用了一个函数更改。现在我必须禁用除选中复选框以外的所有复选框。什么参数应该通过更改功能?在更改功能中我需要做什么才能获得所需的输出?
<div class = "auto_hi_wid " style = "margin-left:10px" id = "generate_shipment">
<table border = '2' style="width:100%">
<thead>
<tr class = "odd">
<th scope = "col" abbr ="RouteName"width = "0%">RouteName</th>
<th scope = "col" abbr ="StartLocation"width = "60%">StartLocation</th>
<th scope = "col" abbr ="EndLocation"width = "20%">EndLocation</th>
<th scope = "col" abbr ="StartTime"width = "10%">StartTime</th>
<th scope = "col" abbr ="EndTime"width = "10%">EndTime</th>
<th scope = "col" abbr ="SelectBox"width = "10%">SelectBox</th>
</tr>
</thead>
</table>
<?php
if (sizeof($bookmarked_route) == 0) {
echo '<br><div style="text-align:center;font-size:200%;">No Results </div>';
}
else {
$start_time = "00:00";
echo "<table>\n";
foreach ($bookmarked_route as $route) {
$route1 = json_decode($route['route_info'], true);
if (isset($route['route_name'])) {
echo "<tr>\n".
"<td>{$route['route_name']}</td>\n".
"<td>{$route1['start_location']}</td>\n".
"<td>{$route1['end_location']}</td>\n".
"<td>{$start_time}</td>\n".
"<td>{$route1['vehicle_engine_time_in_sec']}
</td>\n".
"<td><input type=\"checkbox\" name=\"checkbox\"
value=\"\"id=\"checkbox_{$route['route_name']}\"onclick=\"change()\"></td></tr>";
}
}
echo "</table>";
}
?>
</div>
function change(){}
答案 0 :(得分:0)
这是使用jquery的解决方案。我用类来处理它。试试这个
<?php
if (sizeof($bookmarked_route) == 0) {
echo '<br><div style="text-align:center;font-size:200%;">No Results </div>';
}
else {
$start_time = "00:00";
echo "<table>\n";
foreach ($bookmarked_route as $route) {
$route1 = json_decode($route['route_info'], true);
if (isset($route['route_name'])) {
echo "<tr>\n".
"<td>{$route['route_name']}</td>\n".
"<td>{$route1['start_location']}</td>\n".
"<td>{$route1['end_location']}</td>\n".
"<td>{$start_time}</td>\n".
"<td>{$route1['vehicle_engine_time_in_sec']}
</td>\n".
"<td><input type=\"checkbox\" name=\"checkbox\"
value=\"\"id=\"checkbox_{$route['route_name']}\" class=\"change_states\"></td></tr>";
}
}
echo "</table>";
}
?>
JQuery:
<script type="text/javascript">
$(document).ready(function() {
$('.change_states').on("change",function(){
if($(this).prop("checked") == true){
$(".change_states").attr("disabled", true); //disable all check box
$(this).removeAttr("disabled");// enable current checkbox
}
else //Add this part only if you have to enable all checkbox after uncheck cuurent one
{
$(".change_states").removeAttr("disabled");
}
});
});
</script>