使用for循环通过id替换元素的Javascript

时间:2016-11-07 15:34:50

标签: javascript html

使用markdown转换器javascript转换用户回复区域中的文本,但它只获取其他用户的最后一个文本并将其放在顶部我不知道我做错了什么。

<script>
var inputs = document.getElementsByClassName("RepIcer");
var converter1 = Markdown.getSanitizingConverter();
var CODESOFTLAB = new Markdown.Converter(converter1);

for( var i = 0; i < inputs.length; i++ ){
  var input = inputs[i];
  var value = input.value;
  var MarkDownPreviewHtml = CODESOFTLAB.makeHtml(value);
  var targetId = input.id.replace("before", "replysjl");
  var targetSpan = document.getElementById( targetId );
  targetSpan.innerHTML = MarkDownPreviewHtml;
  var a = 10;
}//for()

</script>
    <p id="reply-0"></p>
    <textarea id="replybefore-0" style="display:none;" class="RepIcer">Hello how are you</textarea>
    
    <p id="reply-5"></p>
    <textarea id="replybefore-5" style="display:none;" class="RepIcer">HHHH okay</textarea>
    
    <p id="reply-6"></p>
    <textarea id="replybefore-6" style="display:none;" class="RepIcer">Whuyyyy</textarea>
    
    <p id="reply-10"></p>
    <textarea id="replybefore-10" style="display:none;" class="RepIcer">Not working</textarea>

我的html示例

<p id="reply-0"></p>
<textarea id="replybefore-0" style="display:none;" class="RepIcer">Hello how are you</textarea>

<p id="reply-5"></p>
<textarea id="replybefore-5" style="display:none;" class="RepIcer">HHHH okay</textarea>

<p id="reply-6"></p>
<textarea id="replybefore-6" style="display:none;" class="RepIcer">Whuyyyy</textarea>

<p id="reply-10"></p>
<textarea id="replybefore-10" style="display:none;" class="RepIcer">Not working</textarea>

为什么我混淆了ptextarea元素id是基于在数据库中插入回复的时间来自db的回复消息的id是我在reply-XX and replybefore-XX中使用的内容如果这是另一种方式我可以做到添加像“12345 ......”这样的假身份证,直到最后一个回复我会喜欢它

这里是我的javascript来获取textarea中的文本并根据每个元素的id显示在p元素中

 <script>
    var inputs = document.getElementsByClassName("RepIcer");
        var converter1 = Markdown.getSanitizingConverter();
        var CODESOFTLAB = new Markdown.Converter(converter1);
        
        for( var i = 0; i < inputs.length; i++ ){
          var input = inputs[i];
          var value = input.value;
          var MarkDownPreviewHtml = CODESOFTLAB.makeHtml(value);
          var targetId = input.id.replace("before", "replyList");
          var targetSpan = document.getElementById( targetId );
          targetSpan.innerHTML = MarkDownPreviewHtml;
          var a = 10;
        }
    </script>

1 个答案:

答案 0 :(得分:0)

以下是没有Markdown的jsFiddle版本,但您可以从那里进行详细说明。

您的targetId替换未正确替换,请参阅下面的代码:

var inputs = document.getElementsByClassName("RepIcer");

for( var i = 0; i < inputs.length; i++ ){
  var input = inputs[i];
  var value = input.value;
  var targetId = input.id.replace("before", "");
  var targetSpan = document.getElementById( targetId );
  targetSpan.innerHTML = value;

}