Dynamicaly更改<textarea >大小，樣式

如何更改字段大小diynamicaly？
我有一個選擇字段，並有3個不同值的選項。因此，如果用戶選擇其中的一個，你會看到這些值。但我怎樣才能改變這種狀況，從選項字段中的值適合在Dynamicaly更改<textarea >大小，樣式

function changeText() 
     { 

      var select  = document.getElementById("surl"); 
      var textfield = document.getElementById("turl"); 
      var bold   = document.getElementById("burl"); 
      var link   = document.getElementById("linkText"); 

      if(bold.style.display == "none") 
       bold.style.display = ""; 
      //if(link.innerHtml) 

      bold.innerHtml = select.value; 
      //if(link.innerHTML !="") 
       link.innerHTML= select.value; 
      textfield.value = select.value; 

     } 


<b>Sample: </b><select id="surl" onchange="changeText();" style="visibility: visible;" name="linkText"> 
     <option>Select LinkText</option> 
     <option value="<a href='http://www.doesntexist.dsdsd/'>Want sign? http://www.doesntexist.dsdsd</a>"> 
      Variant1 
     </option> 
      <option value="<a href='http://www.doesntexist.dsdsd/'>Wanna killme? http://www.doesntexist.dsdsd</a>"> 
      Variant 2 
     </option> 


    </select> 
    <br /> 
    <div class="succes"> 
    <span id="burl" style="display: none"><br /><a id="linkText" href="http://www.doesntexist/"></a></span> 
    </div> 
    </p> 
    <p> 

     <textarea id="turl" style=""> 
     <a href="http://www.doesntexist">text...</a> 
     </textarea> 
    </p>

來源

2009-11-17 streetparade

示例代碼請問？ – Lukman 2009-11-17 13:11:18

好的首席，你會得到它;-) – streetparade 2009-11-17 13:12:56

對不起，我一定誤會了你的問題。

所以你想調整一個textarea動態的基礎上，它的內容？你可以使用jQuery autoResize plugin這個...

來源

2009-11-18 07:40:07

例如大小：

<script type="text/javascript"> 
document.getElementById("textarea_id").style.width = "300px"; 
document.getElementById("textarea_id").style.width = "200px"; 
</script>

來源

2009-11-17 13:16:34

啊，問題已更新。借調@Mathias Bynens'的答案。 – 2009-11-17 13:24:21

快速「N」髒jQuery的解決辦法是以下幾點：

$('input#foo-option-1').bind('change, click', function() { 
if ($(this).is(':checked')) { 
    $('textarea').css('height', '150px'); 
} 
}); 

$('input#foo-option-2').bind('change, click', function() { 
if ($(this).is(':checked')) { 
    $('textarea').css('height', '250px'); 
} 
}); 

$('input#foo-option-3').bind('change, click', function() { 
if ($(this).is(':checked')) { 
    $('textarea').css('height', '350px'); 
} 
});

當然，這段代碼不是非常乾燥。此外，通過JavaScript修改CSS屬性永遠不是一個好主意 - 最好是通過JS動態添加類，並在CSS文件中指定實際的CSS（duh）。

來源

2009-11-17 13:17:07

這不是我在找什麼，代碼看起來像意大利麪條機智番茄醬 – streetparade 2009-11-17 14:22:10

@streetparade>這很粗魯 – 2009-12-22 15:44:30

首先，我認爲有更多的開發者可以提供幫助;這裏的任何方式就是答案

首先創建它計算出的strlen

function strlen(strVar) 
{ 
    return(strVar.length) 
}

其次建立VAR tfcount功能

var tfcount  = strlen(select.value);

和finaly

textfield.style.width = tfcount < 110 ? tfcount = 110 : 3.5*tfcount+"px"; 
textfield.style.height = tfcount < 110 ? tfcount = 110 : tfcount/2.5+"px";

來源

2009-11-17 14:21:17 streetparade

這不是他的問題的答案。 OP想要根據選擇哪個單選按鈕來調整文本區域的大小，而不是在textarea的內容上。 – 2009-11-17 14:35:42

首先上面的問題沒有單選按鈕。他們是一個有多個選項字段的選擇字段。上面的答案正是問題在於動態調整文本區域的大小。 – streetparade 2009-11-17 19:45:23

Dynamicaly更改<textarea >大小，樣式

回答

相關問題