Javascript 在div单击时多次选择更改

我试图在div单击时更改多个选择，问题是只有最后一次单击才保持选中状态，如果有人知道如何解决此问题，我将不胜感激

编辑： 选择是动态的，所以我不知道会有多少个，因此我不能给它们一个类或id，我仅有的数据是选项值

$（“div”）。在（“单击”，函数（）{
$（“select”）.val（$（this.data（“value”））；
});

1.
2.
3.
A.
B
C
1.
2.
3.
A.
B
C
如果您通过为每个div指定一个属性
s
，该属性包含
数字
或
字母
，将每个div链接到其中一个选择，则仅当单击div时才会更改该选择


$（“div”）。在（“单击”，函数（）{
var sel=this.getAttribute（'s'）
$（“#”+sel.val（$（this.data（“value”））；
});

1.
2.
3.
A.
B
C
1.
2.
3.
A.
B
C
如果您通过为每个div指定一个属性
s
，该属性包含
数字
或
字母
，将每个div链接到其中一个选择，则仅当单击div时才会更改该选择


$（“div”）。在（“单击”，函数（）{
var sel=this.getAttribute（'s'）
$（“#”+sel.val（$（this.data（“value”））；
});

1.
2.
3.
A.
B
C
1.
2.
3.
A.
B
C
您应该指定要填充的
选择
，否则它将尝试用您单击的值更新
选择
。一旦
选择
中的值不同，其中一个值在用户单击后将始终保持空白

我建议采用下面的策略，为每个
select
设置一个类，并使用与该类相关的
data-
属性



$（“div”）。在（“单击”，函数（）上{
var targetClass=$（此）.data（“目标”）；
$（“选择”+targetClass）.val（$（此）.data（“值”）；
});

1.
1.
2.
3.
A.
B
C
1.
2.
3.
A.
B
C
您应该指定要填充的
选择
，否则它将尝试用您单击的值更新
选择
。一旦
选择
中的值不同，其中一个值在用户单击后将始终保持空白

我建议采用下面的策略，为每个
select
设置一个类，并使用与该类相关的
data-
属性



$（“div”）。在（“单击”，函数（）上{
var targetClass=$（此）.data（“目标”）；
$（“选择”+targetClass）.val（$（此）.data（“值”）；
});

1.
1.
2.
3.
A.
B
C
1.
2.
3.
A.
B
C
您的
数据值
值对于两个选择都无效。如果您试图设置的值不存在于该选择的某个选项中，则不会显示任何值

通过使用
：has（）
选择器修饰符，可以使其仅更改包含具有该值的选项的选择的值


$（“div”）。在（“单击”，函数（）{
让newval=$（this.data（“value”）；
$（`select:has（[value='${newval}]]）`.val（newval）；
});

1.
2.
3.
A.
B
C
1.
2.
3.
A.
B
C
您的
数据值
值对于两个选择都无效。如果您试图设置的值不存在于该选择的某个选项中，则不会显示任何值

通过使用
：has（）
选择器修饰符，可以使其仅更改包含具有该值的选项的选择的值


$（“div”）。在（“单击”，函数（）{
让newval=$（this.data（“value”）；
$（`select:has（[value='${newval}]]）`.val（newval）；
});

1.
2.
3.
A.
B
C
1.
2.
3.
A.
B
C
因此，我单击1,2,3，它会更改第一个选择，然后单击a、b、c，它会更改第二个选择，但会清除第一个选择的值。单击a、b、c的div时，是否要将值保留在第一个选项中？因此，我单击1、2、3，它会更改第一个选择，然后单击a、b、c，它会更改第二个选项，但会清除第一个选项中的值。单击a、b、c的div时，是否要将值保留在第一个值中？