當複選框被選中時如何給textarea添加值

我正在使用下面的函數，我在這裏找到了關於我的問題的工作，只有一個問題是，我有一長串選擇，用戶檢查超過3-4個複選框時，textarea上添加的一些文本或值不再可見。有沒有什麼辦法可以讓每一個盒子都檢查被添加到文本區域的文本是否始終可見？任何幫助是極大的讚賞。當複選框被選中時如何給textarea添加值

- 感謝您的光臨！

<input type="text" value="" class="textfield" id="video0_tags" name="video0_tags"> 
<div class="taglist"> 
<label><input type="checkbox" value="2D Animation">2D Animation</label> 
<label><input type="checkbox" value="3D Animation">3D Animation</label> 
<label><input type="checkbox" value="Animatronics">Animatronics</label> 
<label><input type="checkbox" value="Architectural">Architectural</label> 
<label><input type="checkbox" value="Cartoon">Cartoon</label> 
<label><input type="checkbox" value="Cell Animation">Cell Animation</label> 
<label><input type="checkbox" value="Character Animation">Character Animation</label><label><input type="checkbox" value="Cut & Paste">Cut & Paste</label> 
<label><input type="checkbox" value="Doodle">Doodle</label> 
<label><input type="checkbox" value="HDR">HDR</label> 
<label><input type="checkbox" value="High Speed">High Speed</label> 
<label><input type="checkbox" value="Illustration">Illustration</label> 
<label><input type="checkbox" value="Live Action">Live Action</label> 
<label><input type="checkbox" value="Macro">Macro</label> 
<label><input type="checkbox" value="Motion Design">Motion Design</label> 
<label><input type="checkbox" value="Motion Graphics">Motion Graphics</label> 
<label><input type="checkbox" value="Moving Installation">Moving Installation</label> 
</div> 


function updateTextArea() {  
    var allVals = []; 
    $('.taglist :checked').each(function() { 
     allVals.push($(this).val()); 
    }); 
    $('#video0_tags').val(allVals) 
    } 
    $(function() { 
     $('.taglist input').click(updateTextArea); 
     updateTextArea(); 
});

來源

2011-03-28 vaqz

因此，您希望文本區域在每次添加內容時都增長嗎？ – Patricia 2011-03-28 13:38:51

這就是說textarea的內容溢出了嗎？你可以強制滾動。 – canon 2011-03-28 13:39:42

你說的是「textarea」，但是你的代碼顯示了一個文本「輸入」。他們非常不同，你是指哪一個？ – Albireo 2011-03-28 13:47:52

將文本輸入更改爲textarea，它會自動添加一個滾動條，因爲它需要它。

來源

2011-03-28 13:51:08 jmccarthy

首先，你需要有一個textarea元素，所以用textarea改變輸入標籤。然後在updateTextArea函數上，您可以在其上設置rows屬性，以便其中的所有文本都可見。請參閱http://jsfiddle.net/7b5fk/1/

來源

2011-03-28 13:52:54

嗨亞歷克斯感謝你的偉大工作的例子。有沒有什麼辦法讓文本剛剛添加在已經在輸入中的單詞旁邊（順便說一下，當我使用textarea這個詞我打算說輸入），當它到達最後（我的意思是右側的輸入）文本移動到左側給新的文本添加到右側的空間？有什麼想法嗎？謝謝！ – vaqz 2011-03-28 14:59:41

不錯的一個亞歷克斯。它的工作原理很好.. – aton1004 2016-04-03 11:00:53

首先，您需要將video0_tags更改爲textarea。接下來，您需要將.click（）事件附加到每個複選框，以便每個選擇都相應地更新textarea。

<textarea id="video0_tags"></textarea> 

$(document).ready(function(){ 
    $(".taglist input").click(function(){ 
     $("#video0_tags").text(''); 
     $(".taglist :checked").each(function(){ 
       $("#video0_tags").append($(this).val() + "\n"); 
     }); 
    }); 
});

來源

2011-03-28 13:59:47

這裏有一小段代碼。 – staypuftman 2014-05-08 15:01:01

當複選框被選中時如何給textarea添加值

回答

相關問題