Javascript 单击两个图像以显示另一个图像

希望我能解释清楚：）

当选择2个图像时，我希望显示不同的图像，例如，有6个盘子选项和4个食物选项。用户将选择图片和食物项目，并根据他们选择的内容，显示带有盘子和食物的图片

我找了又找。我所想的是，当选择两个输入（图像）时，两个javascript会显示一个图像。e、 g.输入：红盘+输入：鸡肉=红盘上有鸡肉

结果图像显示在这里
像这样的事？（显然，使用图像而不是文本）

（单击“运行代码段”进行播放）


$（“#板分区”）。单击（函数（）{
$（this.parent（）.children（）.removeClass（'selected'）；
$（this.addClass（'selected'）；
$（“#结果”）。文本（“请选择食物”）；
});
$（“#食品部”）。单击（函数（）{
设plate=$（'#plates.selected'）.text（）；
让食物=$（this.text（）；
$（“#结果”）.text（“+盘子中有“+食物+”）；
});

#盘子、食物{
光标：指针；
}
.选定{
字号：700；
}
请选择一个盘子和一种食物
盘子
食品
板1
板2
板3
板4
板5
板6
食物1
食物2
食物3
食物4
有一些javascript
-是的，你会这样做的。是的，这基本上就是我的意思。出于某种原因，当我在笔记本电脑上的编辑器中运行此程序时，它无法工作。我把脚本和css放在外部，所有的链接都是正确的。另外，如何让它显示图像，而不是显示一个组合字符串。可能运行代码片段不起作用，因为您的浏览器正在阻止
iframe
s。在触摸笔记本电脑之前，我无法100%确定：）至于显示图像而不是文本，JS中的最后一行可以更改为
$（'#result'）.html（'）
并且您可以将图像命名为food1plate1.jpg、food2plate1.jpg等。