如何將一個文本區域拆分爲兩個文本區域？

我已將兩個文本區域值連接成一個文本區域值。現在，當我點擊回覆按鈕時，我想將文本區域拆分爲舊的兩個文本區域。 HTML視圖圖像和代碼如下：如何將一個文本區域拆分爲兩個文本區域？

HTML：

<div class="container"> 
    <h3 class="text-center text-primary">TextArea Concatenate and Revert</h3> 
    <div class="row"> 
    <div class="col-md-5"> 
     <div class="row"> 
     <div class="col-md-12"> 
      <textarea rows="4" cols="50" id="text_area_1"></textarea> 
     </div> 
     </div> 
     <div class="row"> 
     <div class="col-md-12"> 
      <textarea rows="4" cols="50" id="text_area_2"></textarea> 
     </div> 
     </div> 
     <button type="button" class="btn btn-success" onclick="concatenate()">Concatenate</button> 
    </div> 
    <div class="col-md-5"> 
     <textarea rows="8" cols="100" id="text_area_3"></textarea> 
     <input type="submit" class="btn btn-warning" value="Revert"> 
    </div> 
    </div> 
</div>

的Javascript：

<script> 
    function concatenate(){ 
    document.getElementById("text_area_3").value = 
    document.getElementById("text_area_1").value + " " + 
    document.getElementById("text_area_2").value; 
    } 
</script>

來源

2017-04-27 Shiblee Sadik

你不改變在以前的文本區域東西，所以復原的情況只更新新的一個空值。 – bhansa

爲了能夠分割你必須使用一個獨特的分隔符（「」 - 這一個是沒有幫助的） –

我將點擊提交按鈕時清空前兩個textareas。 –

您應該使用分隔符，以便您可以將值分割回textareas。

<script> 
var one = document.getElementById("text_area_1"); 
var two = document.getElementById("text_area_2"); 
var three = document.getElementById("text_area_3"); 

function concatenate(){ 
    three.value = one.value + ":" + two.value; 
    one.value = ""; 
    two.value = ""; 
    } 

function revert(){ 
    var val = three.value.split(":"); 
    one.value = val[0]; 
    two.value = val[1]; 
    three.value = ""; 
    } 
</script>

見我已經創建的例子：https://jsfiddle.net/ft05wyxt/

來源

2017-04-27 08:37:48 bhansa

如果textarea 1或2包含「：」會怎麼樣？ – NightKn8

應該改變分隔符，完全取決於它將如何使用。 – bhansa

謝謝。但我需要連接兩個文本區域，沒有任何可見的分隔符。 –

使用長度，你可以做如下

var textbox1="testt ttets tetstend__"; 
var textbox2="my second textbox2"; 

//added a space between; 
var mergedTextbox=textbox1+' '+textbox2; 

console.log(textbox1.length,textbox2.length,mergedTextbox.length); 

var splited1=mergedTextbox.substr(0,textbox1.length); 
var splited2=mergedTextbox.substr((textbox1.length+1),textbox2.length); 

console.log(splited1,splited2)

來源

2017-04-27 08:31:54

如何將一個文本區域拆分爲兩個文本區域？

回答

相關問題