Question

我想知道在选择后如何在下拉列表中选择选项值，因为每当我选择任何选项时，它都会被删除，并带有链接的下拉选项。单击它时，它将返回到下拉菜单。选择前的代码

<div class="column-filter-widget">
    <select class="widget-0">
        <option value="">Healthy Life</option>
        <option value="Fruit">Fruit</option>
        <option value="Vegetable">Vegetable</option>
       <option value="Beef">Beef</option>
    </select>

选择“水果”选项后

HTML代码

<div class="column-filter-widget">
     <select class="widget-0">
         <option value="">Healthy Life</option>
         <option value="Vegetable">Vegetable</option>
         <option value="Beef">Beef</option>
     </select><a class="filter-term filter-term-fruit" href="#">Fruit</a>
 </div>

Css代码：

  .column-filter-widgets a.filter-term:hover {text-decoration: line-through!important;}

这是用于检查javascript文件的javasript文件Click here。我知道有很多类似的线程但是因为这个问题是针对Wordpress Plugin tablepress datatables列过滤器小部件而且它是在javascript文件下我不知道如何解决。我确信在查看上述链接后，问题很容易解决。

由于

Answer 1

试试这个，我假设你从我读到的内容中得到了什么，这里有一个JS小提琴给你看http://jsfiddle.net/7a38ast6/7/

<强> JQuery的

var optionvalue = 0;
var optionvalueclass = ""

$('select.widget-0').change(function(){
    optionvalue = $('option:selected', this).text();
    optionvalue = optionvalue.replace(" ", "-");
    optionvalueclass = optionvalue.toLowerCase();
    $(".widget-0").after('<a class="filter-term filter-term-' + optionvalueclass + '" href="#">' + optionvalue + '</a>');
    $('option:selected', this).remove();
});

如何在tablepress的下拉列表中显示当前选定的值选项？

1 个答案: