如何将一个文本区域拆分为两个文本区域？

我已将两个文本区域值连接成一个文本区域值。现在，当我点击回复按钮时，我想将文本区域拆分为旧的两个文本区域。 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

如何将一个文本区域拆分为两个文本区域？

回答

相关问题