JQuery自动完成组合框 - 自动调整

Question

我正在使用jquery autocomplete combobox。我希望它自动调整到与它所替换的下拉菜单相同的大小。相反，目前它只是默认为一个宽度，而不是像默认情况下使用html下拉列表那样的内容宽度。

感谢您的帮助......

Answer 1

这是自动完成我的 “打开” 选项，自动调整大小（autowidth）：

  open: function(e,ui) { 
       var autoData = $(this).data('autocomplete'); 
       var reserText = ",de,del,el,la,las,los,en,"; 

       autoData.menu.element.css({'width':'' + anchoMinimo + 'px'}); 

       autoData.menu.element.find('li').each(function() { 
        var fila = $(this); 
        var texto = fila.text().toLowerCase().replace(autoData.term.toLowerCase(), "<b>" + autoData.term.toLowerCase() + "</b>"); 
        var autoText = ""; 

        texto = texto.split(" "); 

        for(i = 0; i < texto.length; i++){ 

         if((reserText.indexOf(texto[i].replace("<b>","").replace("</b>","")) != "-1") && (i > 0)){ 
          autoText += texto[i] + " "; 
         }else if(texto[i].substring(0,3) == "<b>"){ 
          autoText += "<b>" + texto[i].charAt(3).toUpperCase() + texto[i].substring(4) + " "; 
         }else{ 
          autoText += texto[i].charAt(0).toUpperCase() + texto[i].substring(1) + " "; 
         } 
        } 

        autoText = autoText.replace(" De "," de ").replace(" Del "," del ").replace(" Los "," los ").replace(" El "," el ").replace(" En "," en ").replace(" La "," la ").replace(" Las "," las "); 

        fila.find('a').text(""); 
        fila.find('a').append(autoText); 

        // Ahora vamos a calcular el ancho de la cadena más ancha para saber qué ancho tiene que tener el combo. 
        ancho = autoText.length * 5; // Con esta fuente de letra, en IE, etc... 

        if(ancho > anchoFilaDestinos){ 
         anchoFilaDestinos = ancho; 
        } 
        // Fin del cálculo del ancho. 

        fila.find('a').css({'white-space':'nowrap','width':'276px','text-align':'left'}); 

        if(fila.index()%2 > 0){ 
         fila.find('a').css({'background-color':'#EFEFEF'}); 
        } 
       } 

见部分从“// Ahora VAMOS一个calcular el ancho de la cadenamásancha para saberquéancho tiene que tener el combo。“

希望这可以帮助你。

Answer 2

我已经提交了一个完全适用于此场景的答案，其中启动的组合框的大小与其替换的选择列表的宽度相同。

尝试this link to another thread。

它使用select元素的宽度而不是列表中的文本。

我也可以用函数来处理document.body字体大小的变化。

问候。