在我的 html 中,我创建了一个表并从数据库中获取数据。该表的目标是为每个学生提供学者意见,因此我为每种类型的学校创建了一个选择下拉列表,其中包含不同的意见选项。
<table>
<tr>
<th>Nom</th>
<th>Prénom</th>
<th>BTS</th>
<th>IUT</th>
<th>Licence</th>
<th>CPGE</th>
<th>Ecole</th>
</tr>
<!-- PHP CODE TO FETCH DATA FROM ROWS -->
<?php
// LOOP TILL END OF DATA
while($rows=$result->fetchArray(SQLITE3_ASSOC))
{
?>
<tr>
<!-- FETCHING DATA FROM EACH
ROW OF EVERY COLUMN -->
<td><?php echo $rows['NOM'];?></td>
<td><?php echo $rows['PRENOM'];?></td>
<td><select name="Avis" id="avis_BTS" onchange="change()">
<option value="">Avis</option>
<option value="TF">Très Favorable</option>
<option value="F">Favorable</option>
<option value="R">Réservé</option>
<option value="D">Défavorable</option>
</select>
</td>
<td><select name="Avis" id="avis_IUT" onchange="change()">>
<option value="">Avis</option>
<option value="TF">Très Favorable</option>
<option value="F">Favorable</option>
<option value="R">Réservé</option>
<option value="D">Défavorable</option>
</select>
</td>
<td><select name="Avis" id="avis_Licence" onchange="change()">>
<option value="">Avis</option>
<option value="TF">Très Favorable</option>
<option value="F">Favorable</option>
<option value="R">Réservé</option>
<option value="D">Défavorable</option>
</select>
</td>
<td><select name="Avis" id="avis_CPGE" onchange="change()">>
<option value="">Avis</option>
<option value="TF">Très Favorable</option>
<option value="F">Favorable</option>
<option value="R">Réservé</option>
<option value="D">Défavorable</option>
</select>
</td>
<td><select name="Avis" id="avis_Ecole" onchange="change()">>
<option value="">Avis</option>
<option value="TF">Très Favorable</option>
<option value="F">Favorable</option>
<option value="R">Réservé</option>
<option value="D">Défavorable</option>
</select>
</td>
</tr>
<?php
}
?>
</table>
我还创建了一个java脚本文件,但它不起作用
导入html
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="utf-8">
<script type="text/javascript" src="script.js"></script>
<title>Avis Terminales</title>
JS文件
// Initialisation des variables
var avis = "";
// fonction pour bien montrer visuellement au professeur que e choix a été validé
function change()
{
if(document.getElementsByID("avis_BTS").value != ""){
document.getElementById("avis_BTS").style.backgroundColor = "green";
}
}
// Pour récuperer les avis et les mettres dans une variable pour chaque élève
function save()
{
//var avis_bts = document.getElementById("avis_BTS").value;
// document.write(avis_bts);
//document.write(5+6);
let selection = document.getElementById('avis_BTS');
if(selection.selectedIndex == 1){
a = "Très Favorable";
}
else if(selection.selectedIndex == 2){
a = "Favorable";
}
else{
a = "Avis";
}
document.getElementById('reponse2').innerHTML = "hello";
}
我的网页没有任何变化
授权会有帮助。 删除内联更改并有类似的内容
window.addEventListener('DOMContentLoaded, () => {
const table = document.querySelector('table tbody'); // please add thead and tbody to have valid HTML
const rows = table.querySelectorAll('tr');
table.addEventListener('change', (e) => {
const tgt = e.target;
if (!tgt.matches('select[name=Avis')) return; // not a select
const avis = Array.from(rows).map(row => {
const name = Array.from(row.querySelectorAll('td')).slice(0,2).map(cell => cell.textContent).join(' '); // name
const grades = Array.from(row.querySelectorAll('select'))
.map(select => ({[select.id]: select.value}));
return { "Nom": name, grades });
console.log(avis)
});
});