我希望能够选择一个表格单元格，然后按一个按钮以将订单数据提交到所选的数据单元格中。因此，在订购某人的食物时，请选择该人订购的表格单元格，然后按与要订购的项目相对应的按钮，并将其显示在其订购单元格（称为类型）中
function openCity(evt, menuName) {
// Declare all variables
var i, tabcontent, tablinks;
// Get all elements with class="tabcontent" and hide them
tabcontent = document.getElementsByClassName("tabcontent");
for (i = 0; i < tabcontent.length; i++) {
tabcontent[i].style.display = "none";
}
// Get all elements with class="tablinks" and remove the class "active"
tablinks = document.getElementsByClassName("tablinks");
for (i = 0; i < tablinks.length; i++) {
tablinks[i].className = tablinks[i].className.replace(" active", "");
}
// Show the current tab, and add an "active" class to the button that opened the tab
document.getElementById(menuName).style.display = "block";
evt.currentTarget.className += " active";
}
if (isset("entreeMushrooms")){} body {
background-color: #DCDCDC;
}
.tab {
overflow: hidden;
padding-left: 380px;
text-align: center;
background-color: #e67300;
}
/* Style the buttons that are used to open the tab content */
.tab button {
background-color: inherit;
float: left;
border: none;
outline: none;
cursor: pointer;
padding: 14px 16px;
transition: 0.3s;
}
.tablinks {
vertical-align:middle;
text-shadow: 1px 1px #000000;
text-align:center;
border:1px solid #ccc;
font-size:18px;
font-weight:bold;
color:#e67300;
color: white;
}
/* Change background color of buttons on hover */
.tab button:hover {
background-color: #ddd;
}
/* Create an active/current tablink class */
.tab button.active {
background-color: #ccc;
}
/* Style the tab content */
.tabcontent {
display: none;
padding: 6px 12px;
border: 1px solid #ccc;
border-top: none;
}
.entreeSize {
padding-left: 200px;
}
.entreeItem {
vertical-align:middle;
text-shadow: 1px 1px #000000;
text-align:center;
border:1px solid #000000;
font-size:18px;
font-weight:bold;
width:225px;
height:45px;
background-color:#e67300;
color:#ffffff;
border-radius: 5px;
cursor: pointer;
}
table, td, th {
border: 1px solid black;
}
table {
border-collapse: collapse;
width: 1000px;
background-color: white;
margin-right: 100px;
margin: auto;
text-shadow: 1px 1px #000000;
font-size:16px;
font-weight:bold;
background-color:#e67300;
color:#ffffff;
}
.tableAlign{
text-align: center;
padding-right: 100px;
padding-left: 100px;
}
td {
height: 20px;
vertical-align: bottom;
}
.entreeTable {
padding-right: 5%;
margin-left: auto;
margin-right: auto;
}
.name {
vertical-align:middle;
text-shadow: 1px 1px #000000;
text-align:center;
border:1px solid #000000;
font-size:16px;
font-weight:bold;
width:130px;
height:35px;
background-color:#e67300;
color:#ffffff;
border-radius: 7px;
cursor: pointer;
}<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Main Screen</title>
</head>
<!-- Editable Table for Entrees -->
<body>
<div class="entreeTable">
<table style="text-align:center;">
<!-- Shows name in log out button -->
<?php session_start();
$myfile = fopen("employeeNames.txt", "r") or die("Unable to open file!");
//reads raw file
$string = fread($myfile,filesize("employeeNames.txt"));
//turns the string to array
$a = explode(',', $string);
foreach ($a as $result) {
$b = explode('. ', $result);
$names[trim($b[0])] = trim($b[1]);
}
//closes file
fclose($myfile);
@$username = @$names[$_SESSION['code']];
?>
<form action="keypad.php">
<input type="submit" name="Return" class="name" value="<?php echo($username); ?>">
</form>
<div class="tableAlign">
<br>
<tr>
<td width="50px">Cover</td>
<td width="250px">Type</td>
<td width="50px">Cover</td>
<td width="250px">Type</td>
</tr>
<tr>
<td width="50px">1</td>
<td width="250px"><div contenteditable></div></td>
<td width="50px">6</td>
<td width="250px"><div contenteditable></div></td>
<tr>
<td width="50px">2</td>
<td width="250px"><div contenteditable></div></td>
<td width="50px">7</td>
<td width="250px"><div contenteditable></div></td>
</tr>
<tr>
<td width="50px">3</td>
<td width="250px"><div contenteditable></div></td>
<td width="50px">8</td>
<td width="250px"><div contenteditable></div></td>
</tr>
<tr>
<td width="50px">4</td>
<td width="250px"><div contenteditable></div></td>
<td width="50px">9</td>
<td width="250px"><div contenteditable></div></td>
</tr>
<tr>
<td width="50px">5</td>
<td width="250px"><div contenteditable></div></td>
<td width="50px">10</td>
<td width="250px"><div contenteditable></div></td>
</tr>
</table>
</div>
</div>
</div>
<br><br><br><br>
<!-- Tab links -->
<div class="tab">
<button class="tablinks" onclick="openCity(event, 'Entree')">Entree</button>
<button class="tablinks" onclick="openCity(event, 'From the Grill')">From the Grill</button>
<button class="tablinks" onclick="openCity(event, 'Dessert')">Dessert</button>
<button class="tablinks" onclick="openCity(event, 'Soft Drinks')">Soft Drinks</button>
<button class="tablinks" onclick="openCity(event, 'Beer')">Beer</button>
<button class="tablinks" onclick="openCity(event, 'Wines')">Wines</button>
</div>
<!-- Tab content -->
<div id="Entree" class="tabcontent">
<div class="entreeSize">
<input type="submit" class="entreeItem" name="entreeMushrooms" value="Baked Garlic Mushrooms">
<input type="submit" class="entreeItem" name="entreeHalloumi" value="Fried Halloumi Cheese">
<input type="submit" class="entreeItem" name="entreeKebab" value="Chicken Breast Kebab">
<input type="submit" class="entreeItem" name="entreeSkewer" value="Tiger Prawn Skewer"> <br><br>
<input type="submit" class="entreeItem" name="entreeRibs" value="Pork Spare Ribs">
<input type="submit" class="entreeItem" name="entreeBoerewoers" value="Grilled Boerewoers">
<input type="submit" class="entreeItem" name="entreePork" value="Grilled Pork Belly">
<input type="submit" class="entreeItem" name="entreeCutlets" value="Lamb Cutlets"><br><br>
<input type="submit" class="entreeItem" name="entreePlatter" value="Mixed Platter for 2">
</div>
</div>
<div id="From the Grill" class="tabcontent">
<div class="entreeSize">
<input type="submit" class="entreeItem" name="mainRump" value="Rump">
<input type="submit" class="entreeItem" name="mainPorterhouse" value="Porterhouse">
<input type="submit" class="entreeItem" name="mainEyeFillet" value="Eye Fillet">
<input type="submit" class="entreeItem" name="mainScotchFillet" value="Scotch Fillet">
<input type="submit" class="entreeItem" name="mainRibEye" value="Rib Eye on the Bone">
<input type="submit" class="entreeItem" name="mainTBone" value="T-Bone">
<input type="submit" class="entreeItem" name="mainCutlets" value="Lamb Cutlets">
<input type="submit" class="entreeItem" name="mainBreast" value="Chicken Breast">
<input type="submit" class="entreeItem" name="mainSalmon" value="Atlantic Salmon">
<input type="submit" class="entreeItem" name="mainVegMeal" value="Vegetarian Meal">
<input type="submit" class="entreeItem" name="mainPorkRibs" value="Pork Spare Ribs">
</div>
</div>
<div id="From the Grill" class="tabcontent">
<h3>From the Grill</h3>
</div>
<div id="Dessert" class="tabcontent">
<h3>Dessert</h3>
</div>
<div id="Soft Drinks" class="tabcontent">
<h3>Soft Drinks</h3>
</div>
<div id="Beer" class="tabcontent">
<h3>Beer</h3>
</div>
<div id="Wines" class="tabcontent">
<h3>Wines</h3>
</div>
</body>
</html>