答案 0 :(得分：0)
# Lay out plot, legend, and table grob
grid.arrange(arrangeGrob(nullGrob(),
p + guides(fill=FALSE) +
theme(axis.text.x=element_blank(),
axis.title.x=element_blank(),
axis.ticks.x=element_blank()),
widths=c(1,8)),
arrangeGrob(arrangeGrob(nullGrob(),leg,heights=c(1,10)), #Can ignore this change
tab, nullGrob(), widths=c(10,45,2)), #'6' to '10' is the vital change
heights=c(5,1)) #Modified this to improve spacing between table and graph
当第一个选择值更改时，这会将第二个选择更改为第一个选择的值
答案 1 :(得分：0)
一个人，纯粹的香草.JS
function data_copy(n)
{
document.querySelectorAll('[NAME^="state"]').forEach(el=>el.value = document.form1['state'+n].value)
}<html>
<head>
<title></title>
</head>
<body bgcolor="#ffffff" text="#000000" link="#0000ff" vlink="#800080" alink="#ff0000">
<table width='400' border='0' cellspacing='1' cellpadding='0'>
<form name=form1 method=post action='http://www.plus2net.com'>
<tr><td >State</td><td><SELECT NAME="state1" onchange="data_copy(1)">
<Option value="One">One</option>
<Option value="Two">Two</option>
<Option value="Three">Three</option>
<Option value="Four">Four</option>
</SELECT>
</td></tr>
<tr><td >State</td><td><SELECT NAME="state2" onchange="data_copy(2)">
<Option value="One">One</option>
<Option value="Two">Two</option>
<Option value="Three">Three</option>
<Option value="Four">Four</option>
</SELECT>
</td></tr>
<tr><td colspan=2 align=center><input type=submit value=Submit></td></tr> </form>
</table>
</body>
</html>
答案 2 :(得分：0)
您可以使用document.getElemebtById，document.querySelector(...)或任何其他<select>函数获取对document.getElement...()的引用，并在第一个更改后，将其值分配给第二个：
const state1 = document.getElementById('state1');
const state2 = document.getElementById('state2');
state1.onchange = function(e) {
state2.value = e.target.value;
};
此外，您的代码存在多个问题：
<form>中不允许<table>，因此您可以将整个表格包裹起来，也可以将其放在单个单元格中。在<table>元素中，您只能使用<caption>，<colgroup>，<thead>，<tfoot>，<tbody>和<tr>。
不带引号的HTML属性也是有效的，但是，如果它们包含不受信任的数据，则逃避它们以避免XSS攻击将更加困难。实际上，大多数HTML转义工具都会使用引号。无论如何，你也应该与之保持一致，所以要么使用双引号，要么单引号或没有引号。
您应该使用小写字母代表HTML代码。虽然浏览器仍然可以理解大写，但由于其更好的可读性，使用小写是一种惯例。这来自需要小写的旧xHTML。
您还应该避免使用事件属性来保持演示文稿和逻辑分离，还要考虑内联元素范围的解决方式。
在另一个答案中有一个很好的解释：onclick="" vs event handler
您不应使用HTML属性来设置元素的样式。这是CSS关注的问题。
最后，如果您仅使用<table>元素进行布局而没有任何语义含义，那么您应该使用其他元素，可能是<ul>和<li>或者只是<div>，并使用CSS定位它们。
虽然position，float和display应该足以满足您的使用案例，但Flexbox可能会派上用场。
总之，它应该是这样的：
const state1 = document.getElementById('state1');
const state2 = document.getElementById('state2');
state1.onchange = function(e) {
state2.value = e.target.value;
};body {
font-family: sans-serif;
}
table {
background: #FFF;
color: #000;
width: 400px;
border: none;
border-collapse: collapse;
}
td {
padding: .25rem;
}
select {
width: 100%;
}
.legend {
width: 50px;
text-align: right;
text-transform: uppercase;
font-size: .75rem;
}
.button {
width: 100%;
border: none;
background: #FFF;
padding: .5rem;
border-radius: 2px;
color: #000;
text-transform: uppercase;
font-size: .75rem;
margin: 1rem 0 0;
box-shadow: 0 0 1rem rgba(0, 0, 0, .25);
transition: box-shadow ease-in .125s;
}
.button:hover {
box-shadow: 0 0 .5rem rgba(0, 0, 0, .25);
}<form
name="form"
method="post"
action="http://www.plus2net.com">
<table>
<tr>
<td class="legend">State</td>
<td>
<select name="state" id="state1">
<option value="One">One</option>
<option value="Two">Two</option>
<option value="Three">Three</option>
<option value="Four">Four</option>
</select>
</td>
</tr>
<tr>
<td class="legend">State</td>
<td>
<select name="state2" id="state2">
<option value="One">One</option>
<option value="Two">Two</option>
<option value="Three">Three</option>
<option value="Four">Four</option>
</select>
</td>
</tr>
<tr>
<td colspan="2">
<input type="submit" value="submit" class="button">
</td>
</tr>
</table>
</form>