html和javascritp写html下拉框,每行带图片

可以通过使用HTML和JavaScript来创建带有图片的下拉框，以下是示例代码：

HTML代码：

<select id="selectBox">
   <option value="1">选项一</option>
   <option value="2">选项二</option>
   <option value="3">选项三</option>
</select>

JavaScript代码：

var selectBox = document.getElementById("selectBox");

var option1 = new Option("选项一", "1");
option1.setAttribute("data-img", "image1.png");
selectBox.options[selectBox.options.length] = option1;

var option2 = new Option("选项二", "2");
option2.setAttribute("data-img", "image2.png");
selectBox.options[selectBox.options.length] = option2;

var option3 = new Option("选项三", "3");
option3.setAttribute("data-img", "image3.png");
selectBox.options[selectBox.options.length] = option3;

selectBox.onchange = function() {
   var selectedOption = this.options[this.selectedIndex];
   var img = document.getElementById("selectedImg");
   img.src = selectedOption.getAttribute("data-img");
}

以上代码将在下拉框中创建三个选项，并分别附带一个图片地址。当用户选择一个选项时，脚本将通过 `getAttribute` 方法获取选中选项的图片地址，并将其设置为 HTML 页面中的 `img` 元素的 `src` 属性值，从而展示出选中选项的图片。