将下拉菜单转换为文本框？ [英] Convert drop-down into textbox?

问题描述

我试图通过javascript或jQuery将已经填充的下拉列表转换为单个文本框，但无法弄清楚！

我想删除/更改选择到td元素，导致在这种情况下9100的值将显示在文本框中，而不是Drop下拉列表。

你可能会问我为什么要这样做，但是由于动态HTML构造，答案非常复杂。
有没有什么办法可以通过jquery或javascript来解决上述问题？提前感谢！

 < td class =mainstuffstyle =padding-right：0; width：1％; > 
< select id =stuffclass =boxedtitle =name =stuff> 
< option value =9100title =Something：> 9100< / option> 
< / select> 
< / td> 
  

解决方案

您可以这样做

  var html =< input id ='stuff'type ='textbox'value =
 + $（＃stuff option：first ）.val（）+/>; 
 $（＃stuff）。remove（）; 
 $（。mainstuff）。append（html）; 
  

请参阅 jsFiddle.net

您可以根据您的要求调整它。

希望这可以帮助你。

I am trying to convert already populated dropdownlist to a single textbox via javascript or jQuery but cant figure it out!

I would like to remove/change The "Select" to "td" element resulting the value in this case "9100" would be displayed in the textbox and not the Drop-down list.

You probably ask why I am doing this, but the answer is quite complicated becouse of dynamic HTML construction. Is there any way abovementioned problem can be solved via Jquery or javascript? Thanx in advance !

<td class="mainstuff" style="padding-right:0; width:1%; ">
<select id="stuff" class="boxed" title="" name="stuff">
    <option value="9100" title="Something:">9100</option>
</select>
</td>

解决方案

You can do this

   var html = "<input id='stuff' type='textbox' value="
               + $("#stuff option:first").val() +" />";
   $("#stuff").remove();
   $(".mainstuff").append(html);

See the demo on jsFiddle.net

You can tweak it according to your requirement.

Hope this helps you.

这篇关于将下拉菜单转换为文本框？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！