我想国旗在我的国家下拉

Question

正在使用的WordPress插件，并与woocommerce其国家下拉工作，它显示文本仅国家，我期待能与标志我的代码的观点是：

如果（function_exists（！ 'wcpbc_manual_country_script'））{

function wcpbc_manual_country_script() { 
    ?> 
    <script type="text/javascript"> 
     jQuery(document).ready(function($){ 
      $('.wcpbc-widget-country-selecting').on('change', 'select.country', function(){ 
       $(this).closest('form').submit(); 
      }); 
     });  
    </script> 
    <?php 
} 

}

ADD_ACTION（ 'wp_print_footer_scripts'， 'wcpbc_manual_country_script'）;

如果（$国家）：>

<form method="post" class="wcpbc-widget-country-selecting">  
    <select class="country" name="wcpbc-manual-country"> 
     <?php foreach ($countries as $key => $value) : ?> 
      <option value="<?php echo $key?>" <?php echo selected($key, $selected_country); ?> ><?php echo $value; ?></option> 
     <?php endforeach; ?> 
    </select>     
</form>   

插件的名称是：https://wordpress.org/plugins/woocommerce-product-price-based-on-countries/

Answer 1

你不能在一个select元素添加图像的选项，但你可以使用这个jquery插件： http://gregfranko.com/jquery.selectBoxIt.js/#IconsandImages

您将需要包括; - jquery.js和 - jQuery的ui.js - selectBoxIt.js和 - selectBoxIt.css

当你遍历你的选择下拉每个国家也将需要引用国家国旗图像，并将其添加到选项上的“data-iconurl”属性。

<option value="country_value" data-iconurl="flag_image_url"> 

然后初始化插件：

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

例如： http://codepen.io/partypete25/pen/pNbpGP