如何将文本添加到表格
问题描述:
答
有多种方法可以执行您请求的实施。 jQuery表格,bootstrap,thymeleaf框架等。但是,为了回答您的具体问题,我们可以添加一个非常简单的HTML与嵌入式JavaScript来获得所需的结果。 我们需要javascript来动态更新选定的文本优先级(下拉菜单)并将其应用于所需的颜色。
我在下面提供了一个基本的样例代码,它可以完成您所需的任务。 javascript函数show()将检查下拉列表中选定的值,然后根据所选下拉值使用文本框中输入的文本动态更新结果表。
<!DOCTYPE html>
<html lang="en">
<head>
<title>Title</title>
<script language="JavaScript">
function show(){
var textEntry = document.getElementById('myText').value;
if(textEntry == ''){
alert("Please enter a task");
return;
}
var selection = document.getElementById('mySelection');
var selectionText = selection.options[selection.selectedIndex].text;
var fontColor='';
if(selection.value=='normal'){
fontColor='#259523';
}
if(selection.value=='undecided'){
fontColor='#3339FF';
}
if(selection.value=='critical'){
fontColor='#FF9F33';
}
document.getElementById('textEntry').innerHTML='<font color="'+fontColor+'">'+textEntry+'</font>';
document.getElementById('priority').innerHTML='<font color="'+fontColor+'">'+selectionText+'</font>';
}
</script>
</head>
<body>
<table>
<tr>
<td>
<input type="text" id="myText">
</td>
<td>
<select id="mySelection">
<option value="normal" selected>Normal</option>
<option value="undecided">If You Can</option>
<option value="critical">Critical</option>
</select>
</td>
<td>
<input type="button" onclick="show()" value="Add">
</td>
</tr>
<tr>
<td id="textEntry"></td>
<td id="priority"></td>
</tr>
</table>
</body>
</html>
你能证明你试过了吗?这将是一个开始的好地方。 – semuzaboi