分享
三行代码  ›  专栏  ›  技术社区  ›  nbert

输入到文本区域[关闭]

  •  -2
  • nbert  · 技术社区  · 6 天前

    我需要找到一个简单的方法从一些 <input> :

    <p class="mono-header pt-1">Nicknames & Names</p>
    
        <div class="form-floating">
            <input type="text" class="form-control bg-dark text-white" name="nickname" placeholder="Nickname" id="nickname" minlength="1" maxlength="32" required>
            <label for="floatingInputValue">Nickname</label>
        </div>
    
    <section class="p-1"></section>
    
        <div class="form-floating">
            <input type="text" class="form-control bg-dark text-white" name="username" placeholder="Username with Identifier" id="username" minlength="2" maxlength="37" required>
            <label for="floatingInputValue">Username with Identifier</label>
        </div>
    
    <hr width="100%">
    
    <p class="mono-header pt-1">About Me</p>
    
        <div class="form-floating">
            <textarea class="form-control bg-dark text-white aboutmetextarea" placeholder="About me" name="aboutme" id="aboutme" maxlength="190" required></textarea>
            <label for="floatingTextarea2">About Me</label>
        </div>
    

    <div class="nickname-name">
        <p class ="fakeginto prewrap" style="font-size: 20px; color: white; margin-bottom: 0px;" id="nickname">----------</p>
        <p class ="prewrap" style="font-size: 14px; color: #B9BBBE; margin-bottom: 0px; font-weight: 500;" id="username">----------</p>
    </div>
    </div>
    <div class="lineinbetween"><div class="lineline"></div></div>
    <div class="aboutme">
    <p class="aboutmeheader fakeginto">ABOUT ME</p>
    <p class="aboutmetext opensans" id="aboutmeresult">----------</p>
    </div>
    

    然后把所有的东西插入 <textarea>

    使用javascript最简单的方法是什么?我不知道从哪里开始,因为我是新来的JS。

    1 回复  |  直到 6 天前
        1
  •  1
  •   Bharat    6 天前

    function merge()
    {
        document.getElementById("finalOutput").innerText = "Hi, " + document.getElementById("input1").value + "-" + document.getElementById("input2").value; 
    }
    <!DOCTYPE html>
    <html lang="en">
    
    <head>
      <title>Test</title>
    </head>
    
    <body>
      <input type=text id=input1><br>
      <input type=text id=input2><br>
      <input type=text id=input3><br>
      <input type=text id=input4><br>
      <input type=text id=input5><br>
      <input type=button onclick="merge()" value=Merge> 
      <hr> 
      
      <textarea id=finalOutput>
      </textarea>
    </body>