2017-04-19 120 views
0

因此,下面是不使用选择标签的自定义下拉菜单的HTML。下拉列表的占位符/默认值是“Acura”,它是列表中的第一个元素(ul)。我正在尝试查看是否可以在不更改下拉列表顺序(制作按字母顺序排列)的情况下更改下拉列表的占位符/默认值(例如,BMW)。(JS/JQuery)更改自定义下拉列表的默认值/占位符?

<span id="builder-make-selection" class="pick"> 
    <span class="label">Make:</span> 
<div class="custom-dd-wrapper builder-makes" tabIndex="1"> 
<div class="custom_dd_select"> 
    <span> 
    <a>Acura</a></span> 
</div> 
<div class="custom_dd_options"> 
    <ul class="custom_dropdown"> 
     <li data-make="Acura">Acura</li> 
     <li data-make="Alfa Romeo">Alfa Romeo</li> 
     <li data-make="Audi">Audi</li> 
     <li data-make="BMW">BMW</li> 
    </ul> 
</div> 

下面是是创造下拉的JavaScript:

(function(h, a) { 
    function k() { 
     var b = a(this).parents("div.custom_dd_wrapper"), 
      f = b.attr("id"), 
      e = a(b).find(".custom_dd_select a"), 
      l = a(this).data(), 
      d = e.text().trim(), 
      g = a(this).text().trim(); 
     "makes-options" == f && (a(b).addClass("active"), e.parent("span").attr("style", a(this).attr("style"))); 
     e.text(g); 
     for (var m in l) { 
      if(m=='make'){ 
       e.parent("span").data(m,l[m]); 
      }     
     } 
     d != g && a(this).closest(".custom_dd_wrapper").trigger("change") 
    } 

    function g() { 
     var b = a(this).closest(".custom_dd_wrapper"); 
     a(b).find("ul").hide(); 
     a(b).find(".custom_dd_select").removeClass("click"); 
     a(b).find(".custom_dd_options").removeClass("show") 
    } 
    h.CustomDropdownView = function() { 
     var b = this; 
     this.vc = !1; 
     a(".cs").on("click", ".trans-disabled", function(a) { 
      a.stopPropagation() 
     }); 
     a(".cs").on("click", ".custom_dd_wrapper, .popup .custom_dd_wrapper", function() { 
      b.vc = !0; 
      var f = a(this).closest(".custom_dd_wrapper"); 
      a(f).find("ul").toggle(); 
      a(f).find(".custom_dd_select").toggleClass("click"); 
      a(f).find(".custom_dd_options").toggleClass("show") 
     }); 
     a(".cs").on("click", ".custom_dd_options .custom_dropdown > li:not(.trans-disabled)", 
      k); 
     if (0 > window.navigator.userAgent.indexOf("MSIE ") && null == navigator.userAgent.match(/Trident.*rv\:11\./)) a(".cs").on("blur", ".custom_dd_wrapper, .popup .custom_dd_wrapper", function() { 
      a(this).find(".custom_dd_options ul").is(":visible") && g.call(this) 
     }); 
     else a(".cs").on("click", function() { 
      if (b.vc) b.vc = !1; 
      else { 
       var f = a(".custom_dropdown").filter(":visible"); 
       0 < f.length && f.each(g); 
      } 
     }); 
     a(".cs").on("click", ".disable", g) 
    } 
}) 

回答

0

你必须改变

<div class="custom_dd_select"> 
    <span> 
    <a>Acura</a></span> 
</div> 

<div class="custom_dd_select"> 
     <span> 
     <a>BMW</a></span> 
</div> 

,将工作

+0

我知道,但是HTML正在从JavaScript的渲染,所以更改对HTML反映,JavaScript的必须进行修改 – AliciaGuerra

+0

那么你可以用一个函数把它写在文件准备好那默认将是宝马 – Pragati