从innerHTML获取文本区数据

Question

可以在收集一整套innerHTML数据的同时获取数据吗？

以下是我的JS代码的一部分。

var css = document.getElementById('SETinfo').innerHTML;
var num = parseInt(document.getElementById('stepNum_count').value);
var name = document.getElementById('step_name_'+id).value;
var desc = document.getElementById('step_desc_'+id).value;
  css += "<div id='new_step_num_"+num+"'>";
  css += "<input type='hidden' name='new_VW_step[]' value='"+id+"'>";
  css += "<div class='step_contain'><div class='step'>";
  css += "<div class='step_circle'>";
  if(num < 10)
    {
  css += "<div class='step_num'>"+num+"</div>";
    }
  else
    {
  css += "<div class='step_num' style='left:8px;'>"+num+"</div>";
    }
  css += "</div>";
  css += "<div class='step_name'>"+name+"</div>";
  css += "<div class='step_divider'> </div>";
  css += "<textarea class='step_detail' name='step_desc_[]'>"+desc+"</textarea>";
  css += "</div> </div>";
  css += "</div>";

document.getElementById('SETinfo').innerHTML = css;
num = num + 1;

除了没有收集/选择的textarea之外，一切都正常工作。

这是我正在尝试做的事情的简化版本的JSfiddle。请注意，当您在文本区中输入文本时，当您单击按钮时，它不会继续。http://jsfiddle.net/MepG5/

Answer 1

这不起作用，因为您正在尝试将标签添加到innerHTML。 var css = document.getElementById('SETinfo').innerHTML;运行良好。使用entities:

var css = document.getElementById('SETinfo').innerHTML;
var num = parseInt(document.getElementById('stepNum_count').value);
var name = document.getElementById('step_name_'+id).value;
var desc = document.getElementById('step_desc_'+id).value;
  css += "<div id='new_step_num_"+num+"'>";
  css += "<input type='hidden' name='new_VW_step[]' value='"+id+"'>";
  css += "<div class='step_contain'><div class='step'>";
  css += "<div class='step_circle'>";
  if(num < 10)
    {
  css += "&lt;div class='step_num'&gt;"+num+"&lt;/div&gt;";
    }
  else
    {
  css += "&lt;div class='step_num' style='left:8px;'&gt;"+num+"&lt;/div&gt;";
    }
  css += "&lt;/div&gt;";
  css += "&lt;div class='step_name'&gt;"+name+"&lt;/div&gt;";
  css += "&lt;div class='step_divider'&gt; &lt;/div&gt;";
  css += "&lt;textarea class='step_detail' name='step_desc_[]'&gt;"+desc+"&lt;/textarea&gt;";
  css += "&lt;/div&gt; &lt;/div&gt;";
  css += "&lt;/div&gt;";

document.getElementById('SETinfo').innerHTML = css;
num = num + 1;

Answer 2

试一试

   var textarea = $('textarea').val();

然后不再是

css += "<textarea class='step_detail' name='step_desc_[]'>"+desc+"</textarea>";

写

css += textarea;

Answer 3

好了，我想出了解决这个问题的一种方法。当创建每个文本区域时，我使用数字计数器分配一个唯一的ID，然后计算到目前为止创建的行数，收集这些值，添加html，然后根据数字计数器重新填充每个文本区域中的数据。如果有人想看实际的代码，我可以更新JSfiddle。