第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號安全，請及時綁定郵箱和手機立即綁定
已解決430363個問題，去搜搜看，總會有你想問的

如何將文本框中的文本保留在附加框中？

如何將文本框中的文本保留在附加框中？

千萬里不及你 2023-10-14 18:33:43
我想要實現(xiàn)的基本上是將輸入中的文本添加到最近附加的內(nèi)容上。是否可以？它基本上就像一個聊天網(wǎng)站。用戶編寫的文本應(yīng)該保存在附加對象中，但我無法實現(xiàn)它。詳細信息：- 用戶鍵入消息的輸入。附加只讀輸入的按鈕。只讀輸入應(yīng)包含用戶在原始輸入中鍵入的消息。這是我的腳本！<html><head>    <title>Friend's Circle</title>    <style>        .Hammer-Div {            background-color: #3a3939;            color: white;            height: 100%;            width: 80px;            border-radius: 10px 10px 10px 10px;            transition: 0.4s;            position: fixed;        }        .container {            display: inline-block;            cursor: pointer;        }        .bar1,        .bar2,        .bar3 {            width: 35px;            height: 5px;            background-color: rgb(105, 105, 105);            margin: 6px 0;            transition: 0.4s;        }        .change .bar1 {            -webkit-transform: rotate(-45deg) translate(-9px, 6px);            transform: rotate(-45deg) translate(-9px, 6px);        }        .change .bar2 {            opacity: 0;        }        .change .bar3 {            -webkit-transform: rotate(45deg) translate(-8px, -8px);            transform: rotate(45deg) translate(-8px, -8px);        }        .Items {            cursor: pointer;        }        p {            font-size: 30px;            display: none;        }        .Results {            height: 100%;            width: 92.5%;            background-color: #585858;            border-radius: 10px 10px 10px 10px;            float: right;        }        .MessageBox {            width: 90%;            height: 80%;            border-radius: 10px 10px 10px 10px;            background-color: hsl(0, 1%, 27%);            border: none;            float: left;            margin-left: 1%;            margin-top: 0.5%;            color: white;            font-size: 30px;            padding-left: 20px;        }        .MessageUnit {            height: 10%;            width: 100%;            background-color: #383838;            border-radius: 10px 10px 10px 10px;        }
查看完整描述

1 回答

?
犯罪嫌疑人X

TA貢獻2080條經(jīng)驗 獲得超4個贊

這是一個供您考慮的方法：

  1. 從 中獲取用戶輸入的文本值MessageBox input。

  2. 創(chuàng)建一個新input標(biāo)簽，創(chuàng)建它readonly并為新輸入分配輸入value中的值MessageBox

  3. 將輸入附加到Results

$("#SendMessage").click(function () {

   // 1

   const msgBoxIn = document.getElementById('MessageBox');


   // 2

   const text = msgBoxIn.value;

   const newMsgIn = document.createElement('input');

   newMsgIn.setAttribute('readonly', true);


   // 3

   newMsgIn.value = text;

   const resultsDiv = documet.getElementById('Results');

   const br = document.createElement('br');

   resultsDiv.appendChild(br);

   resultsDiv.appendChild(newMsgIn);

});

生成的 HTML 將如下所示：


<div class="Results" id="Results">

        <center>

            <div class="MessageUnit">

                <input class="MessageBox" placeholder="Type Your Message Here!" id="MessageBox">

                <img src="https://th.bing.com/th?q=Send+Arrow+Icon&w=120&h=120&c=1&rs=1&qlt=90&cb=1&pid=InlineBlock&mkt=en-WW&adlt=moderate&t=1&mw=247"

                    style="border-radius: 50%; width: 60px; height: 60px; border-color:#ffffff; margin-top: 0.5%; cursor: pointer;"

                    border="4px" id="SendMessage">

            </div>

        </center>

        <br>

        <input readonly value='Value you added'>

</div> 

id另請注意，您在此處使用了相同的名稱class：<div class="Results" id="Results">。id根據(jù)CSS選擇器特異性規(guī)則，只有聲明使用的CSS才會被應(yīng)用。考慮不同的名稱。


注意：該代碼片段是純 JS 格式的?？紤]一下如何使用 jquery 來實現(xiàn)它。


查看完整回答
反對 回復(fù) 2023-10-14
  • 1 回答
  • 0 關(guān)注
  • 106 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯(lián)系客服咨詢優(yōu)惠詳情

 幫助反饋 APP下載

慕課網(wǎng)APP
您的移動學(xué)習(xí)伙伴

 公眾號

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號