我正在尝试将国家/地区标志放在相应的国家/地区代码的前面,例如gmail注册:
我尝试使用img src
和background
,但是图像不可见。我在mysql中有一个带有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>
答案 0 :(得分: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();