Question

基本上你在第一个文本区域表单中键入内容，单击post并在下面生成带有序列号的div。注释框中的文本应在生成的div内打印，但为了功能，现在输出到第二个文本区域。我在将新文本输出到新div元素时遇到问题。我尝试使用innerHTML在每个新div上创建一个新的文本区域，但文本输出不会生成新的div元素。我还尝试将帖子文本附加到左侧的帖子编号，但又无法生成。如果有帮助的话，我正在制作留言板/陈论坛。谢谢先进

＆＃13;

function addtext() {
   var newtext = document.myform.inputtext.value;
   document.myform.outputtext.value += newtext;
}

function addElement() {

   var ni = document.getElementById('myDiv');

   var numi = document.getElementById('theValue');

   var num = (document.getElementById('theValue').value - 1) + 2;

   numi.value = num;

   var newdiv = document.createElement('div');

   var divIdName = 'Post#' + num;

   newdiv.setAttribute('id', divIdName);

   newdiv.innerHTML = (divIdName) + "";
   ni.appendChild(newdiv);
}

＆＃13;

#LL {
   position: relative
}

div {
   display: block;
   color: black;
   border-radius: 19px;
   background: linear-gradient(white, teal, black);
   padding: 20px;
   width: 1440px;
   height: 100px;
   border: 10px solid #fff;
}

#fs {
   border-radius: 12px;
   background: linear-gradient(white, teal, white);
   ;
}

.clearfix {
   overflow: auto;
}

#textbox {
   height: 100px;
   width: 1440px;
   border-radius: 10px;
   background: ;
}

#post {
   border-radius: 15px;
   position: relative;
   left: 1340px;
   color: black;
}

＆＃13;

<body>
   <header>
      <script>
         </script>
   </header>
<fieldset id="fs">
   <input type="hidden" value="0" id="theValue" />
   <legend id=LL>▼
   </legend>
   <form name="myform">
      <textarea id="textbox" type="text" size="50" name="inputtext" />
      </textarea>
      <button id="post" onClick="addtext()">
         <a value="Add New Text" href="javascript:;" onclick="addElement()">
      Post Comment
   </a>
      </button>
</fieldset>

<div id="myDiv">
   <textarea name=outputtext></textarea>
</div>
</form>
<p>TEXT ENTRY DOESN'T WORK YET</p>
</body>

＆＃13;

Answer 1

您永远不会将textarea值放在新创建的div中。你在addElement()函数中有这个。只需简单地添加您要创建的div id名称

newdiv.innerHTML = (divIdName) + "";

如果你想在div中使用textarea内容，请使用此

newdiv.innerHTML = (divIdName) + document.myform.inputtext.value;

＆＃13;

function addtext() {
   var newtext = document.myform.inputtext.value;
   document.myform.outputtext.value += newtext;
}

function addElement() {

   var ni = document.getElementById('myDiv');

   var numi = document.getElementById('theValue');

   var num = (document.getElementById('theValue').value - 1) + 2;

   numi.value = num;

   var newdiv = document.createElement('div');

   var divIdName = 'Post#' + num;

   newdiv.setAttribute('id', divIdName);

   newdiv.innerHTML = (divIdName) + document.myform.inputtext.value;
  
   ni.appendChild(newdiv);
}

＆＃13;

#LL {
   position: relative
}

div {
   display: block;
   color: black;
   border-radius: 19px;
   background: linear-gradient(white, teal, black);
   padding: 20px;
   width: 1440px;
   height: 100px;
   border: 10px solid #fff;
}

#fs {
   border-radius: 12px;
   background: linear-gradient(white, teal, white);
   ;
}

.clearfix {
   overflow: auto;
}

#textbox {
   height: 100px;
   width: 1440px;
   border-radius: 10px;
   background: ;
}

#post {
   border-radius: 15px;
   position: relative;
   left: 1340px;
   color: black;
}

＆＃13;

<body>
   <header>
      <script>
         </script>
   </header>
<fieldset id="fs">
   <input type="hidden" value="0" id="theValue" />
   <legend id=LL>▼
   </legend>
   <form name="myform">
      <textarea id="textbox" type="text" size="50" name="inputtext" />
      </textarea>
      <button id="post" onClick="addtext()">
         <a value="Add New Text" href="javascript:;" onclick="addElement()">
      Post Comment
   </a>
      </button>
</fieldset>

<div id="myDiv">
   <textarea name=outputtext></textarea>
</div>
</form>
<p>TEXT ENTRY DOESN'T WORK YET</p>
</body>

＆＃13;

您还应该尝试从任何页面中删除水平滚动条。网站上的水平滚动不被视为用户友好，因为用户必须将其拖动到屏幕上（通常鼠标滚动不能控制水平滚动）

使用JS将表单输出写入生成的div？

1 个答案: