如何将图像放在 php 的下拉行中

Question

我正在尝试在各自的国家代码前面放置国家标志，例如在 gmail 注册中，如下所示：

我尝试使用 img src 和 background 但图像不是 visible.I 在 mysql 中有一个 table 与 ISO，国家名称，代码。我正在尝试使用 https://ipdata.co/flags api 来填充标志。我的代码：

<select Emp Name='NEW'>
        <option value="">--- Select ---</option>
                 <?
            $list=mysqli_query($con,"select * from country");
        while($row_list=mysqli_fetch_assoc($list)){
            $display="+".$row_list['phonecode']."-".$row_list['name'];
            $flag=$row_list['isosmall'];
            ?>
            <option style="background-image:url(https://ipdata.co/flags/<?php echo $flag;?>.png);"></option>
               // <option value="<img src="https://ipdata.co/flags/<?php echo $flag;?>.png"/></option>
               // <? echo $display; ?>"</option><? if($row_list['iso']==$select){ echo "selected"; } ?>
                                    // <?//echo $row_list['name'];
                                     //echo $display;?>
                </option>
            <?
            }
               ?>
        </select>

Answer 1

您可以使用 this jquery 插件并替换为您的数据：

HTML:

<html>
<head>
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/jquery.selectboxit/3.8.0/jquery.selectBoxIt.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.0/jquery-ui.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.selectboxit/3.8.0/jquery.selectBoxIt.min.js"></script>
</head>
<body>
<select class="country" name="wcpbc-manual-country" id="country">
        <option value="AU" data-iconurl="https://aus.merchnow.com/img/location-aus.png">AU some text</option>
        <option value="IN" data-iconurl="https://images0.voylla.com/flags/inr.gif">IN some text</option>
</select>
</body>
</html>

JS:

 $("#country").selectBoxIt();

JSFiddle example

如何将图像放在 php 的下拉行中

how to put image in dropdown rows in php

php

html-select