在 javascript 列表中制作下拉列表中的选项 html 元素项？答案

【问题标题】：Making the options in a drop down list html element items in a javascript list?在 javascript 列表中制作下拉列表中的选项 html 元素项？
【发布时间】：2019-12-17 00:40:03
【问题描述】：

<html>
<body>
<?php
//student interface
$file = fopen("subject.csv","r");
$subjects = fgetcsv($file);
fclose($file);
//puts the csv file provided into a 2d array
$studentTable = array();
if (($handle = fopen("students.csv", "r")) !== FALSE) {
	while (($data = fgetcsv($handle, 1000, ",")) !== FALSE) {
		$studentTable[] = $data;
	}		fclose($handle);
}
//creates list that will store list of girls emails
$usernames = array();
//runs through studentTable and appends emails to toEmail. 
for ($I = 0; $I < sizeof($studentTable); $I++){
       array_push($usernames, $studentTable[$I][0]);
  }  

?>
<script type="text/javascript"> 
   
// Using PHP implode() function to turn the php list into a javascript list
var subjects = <?php echo '["' . implode('", "', $subjects) . '"]' ?>; 
var usernames = <?php echo '["' . implode('", "', $usernames) . '"]' ?>; 
var select = document.getElementById("usernames");
for(var i = 0; i < usernames.length; i++) {
    var opt = usernames[i];
    var el = document.createElement("option");
    el.textContent = opt;
    el.value = opt;
    select.appendChild(el);
}
var subchoice = [];
subchoice.push(document.getElementById("choice1"), document.getElementById("choice2"), document.getElementById("choice3"), document.getElementById("choice4"), document.getElementById("choice5"));
for(var x = 0; x < subchoice.length; x++) {
	for(var i = 0; i < subjects.length; i++) {
		var opt = subjects[i];
		var el = document.createElement("option");
		el.textContent = opt;
		el.value = opt;
		subchoice[x].appendChild(el);
	}
}
var six = [];
six = subjects;
six.push("null");
var select = document.getElementById("choice6");
for(var i = 0; i < six.length; i++) {
    var opt = six[i];
    var el = document.createElement("option");
    el.textContent = opt;
    el.value = opt;
    select.appendChild(el);
}
</script> 
<h2> Select your subjects! </h2>
<form>
<p> Select your name </p>
<select id='usernames' name='usernames'>
<option>Choose a username</option>
</select>
<p> Select your 1st choice subject </p>
	<select id='choice1' name='choice1'>
	<option>Choose a subject</option>
	</select>
<p> Select your 2nd choice subject </p>
	<select  id='choice2' name='choice2'>
	<option>Choose a subject</option>
	</select>
<p> Select your 3rd choice subject </p>
	<select id='choice3' name='choice3'>
	<option>Choose a subject</option>
	</select>
<p> Select your 4th choice subject </p>
	<select  id='choice4' name='choice4'>
	<option>Choose a subject</option>
	</select>
<p> Select your 5th choice subject </p>
	<select id='choice5' name='choice5' >
	<option>Choose a subject</option>
	</select>
<p> Select your 6th choice subject (none is an option) </p>
	<select id='choice6' name='choice6'>
	<option>Choose a subject</option>
	</select>
</form>

</body>
</html>

我无法在下拉选项卡中显示任何内容。下拉列表应该是主题或用户名列表中的项目。但是，即使我认为我的编码正确，也没有任何反应。它给了我这个错误消息：“Uncaught SyntaxError: Unexpected token '

【问题讨论】：

无论是什么'它'告诉你有一个意外的标记也会告诉你它在哪一行。如果你查看源，你会看到它在哪里。
不要混用 JS 和 PHP。 你的 unexpected 项目在这部分代码中不存在，Ctrl+F 找不到。研究如何阅读错误和how to debug JS code
其实我可以把php数组变成js数组。问题在于这个语句------- for(var i = 0; i

标签： javascript php html arrays drop-down-menu

【解决方案1】：

<html>
<body>
<?php
//student interface
$file = fopen("subject.csv","r");
$subjects = fgetcsv($file);
fclose($file);
//puts the csv file provided into a 2d array
$studentTable = array();
if (($handle = fopen("students.csv", "r")) !== FALSE) {
	while (($data = fgetcsv($handle, 1000, ",")) !== FALSE) {
		$studentTable[] = $data;
	}		fclose($handle);
}
//creates list that will store list of girls emails
$usernames = array();
//runs through studentTable and appends emails to toEmail. 
for ($I = 0; $I < sizeof($studentTable); $I++){
       array_push($usernames, $studentTable[$I][0]);
  }  

?>
<h2> Select your subjects! </h2>
<form method="POST" action='handlestudents.php'>
<p> Select your name </p>
<select id='userN' name='userN'>
        <option selected="selected">Choose one</option>
        <?php
        // Iterating through the product array
        foreach($usernames as $item){
        ?>
        <option value="<?php echo strtolower($item); ?>"><?php echo $item; ?></option>
        <?php
        }
        ?>
</select>
<p> Select your 1st choice subject </p>
	<select id='choice1' name='choice1'>
	<option selected="selected" >Choose a subject</option>
        <?php   
        // Iterating through the product array
        foreach($subjects as $item){
        ?>
        <option value="<?php echo strtolower($item); ?>"><?php echo $item; ?></option>
        <?php
        }
        ?>
	</select>
<p> Select your 2nd choice subject </p>
	<select  id='choice2' name='choice2'>
		<option selected="selected" >Choose a subject</option>
        <?php   
        // Iterating through the product array
        foreach($subjects as $item){
        ?>
        <option value="<?php echo strtolower($item); ?>"><?php echo $item; ?></option>
        <?php
        }
        ?>
	</select>
<p> Select your 3rd choice subject </p>
	<select id='choice3' name='choice3'>
		<option selected="selected" >Choose a subject</option>
        <?php   
        // Iterating through the product array
        foreach($subjects as $item){
        ?>
        <option value="<?php echo strtolower($item); ?>"><?php echo $item; ?></option>
        <?php
        }
        ?>
	</select>
<p> Select your 4th choice subject </p>
	<select  id='choice4' name='choice4'>
		<option selected="selected" >Choose a subject</option>
        <?php   
        // Iterating through the product array
        foreach($subjects as $item){
        ?>
        <option value="<?php echo strtolower($item); ?>"><?php echo $item; ?></option>
        <?php
        }
        ?>
	</select>
<p> Select your 5th choice subject </p>
	<select id='choice5' name='choice5' >
		<option selected="selected" >Choose a subject</option>
        <?php   
        // Iterating through the product array
        foreach($subjects as $item){
        ?>
        <option value="<?php echo strtolower($item); ?>"><?php echo $item; ?></option>
        <?php
        }
        ?>
	</select>
<p> Select your 6th choice subject (none is an option) </p>
	<select id='choice6' name='choice6'>
		<option selected="selected" >Choose a subject</option>
        <?php
        // Iterating through the product array
        foreach($subjects as $item){
        ?>
        <option value="<?php echo strtolower($item); ?>"><?php echo $item; ?></option>
        <?php
        }
        ?>
		<option value = ""> None </option>
	</select>
<input type="submit" value="Submit">
</form>
</body>
</html>

【讨论】：