Question

基本上我通过分配给变量然后将其传递给HTML页面来构建通过JS文件构建的HTML页面。

this.printimg = function(){

  var myimgHTML ='<div>startup content</div>'; 
  var myimgHTML2="" ; 
  var myString="";

        if(this.getPreviewType()=="newView")
  {

    myString +="<a>Cover: </a><br><select id='sub1' style=' width:200px'>";
    myString +='<option value="'+ this.getTitle() +'">'+ this.getTitle() +'</option>';
    myString +="</select></select>";

  }

  else 
  {
  myString+='<div class="col-sm-6 col-md-3">';
  myString+='<div class="thumbnail">';
  myString+='<img style="width:230px" id="'+this.getId()+'" onclick=callToServer("'+this.getCurrent()+'_'+this.getId()+'") src="'+this.getImg()+'" alt="" border="0">';

  myString+='<div class="caption">';
  myString+='<h5 class= "text-center" ><name=""/>'+this.getTitle()+'</h5>';
  myString+='<p class= "text-center book_decs" style="color:#7F7F7F;">'+this.getDesc()+'</p>';
  myString+='</div></div></div></div>';
  }

  myimgHTML2=myString;
     if (this.getTheme() != null)
     {
     return myimgHTML;    
     }
     else if (this.getTheme() == null)
     {
      return myimgHTML2;
     }
   }

}

我的问题是，每当我调用我的JS块时，它都会复制我的选择＆＃34;下拉菜单＆＃34;我的新值应该是这样的：

Select 
- option 1
- option 2
- option 3

不是那样的：

Select
- option 1
Select 
- option 2

我尝试过像jQuery append或addHTML这样的直接方法但是没用，因为它没有解析分配为字符串的HTML代码。

感谢您的帮助。

Answer 1

你必须添加＆＃34;选择＆＃34;在html中标记为静态。然后附加你的＆＃34;选项＆＃34;动态标记。

<select id="dynamic"></selecct>

<script>
   var options = '<option val="opt1"> Option Name </option>';
   options += '<option val="opt2"> Option Name 2</option>';

   $('#dynamic').html(''); // For clearing old data
   $('#dynamic').append(options);

</script>

Answer 2

在你的javascript中有一行你写的

 myString +="</select></select>";

可能是因为这个原因。根据我的理解，似乎不需要两个关闭选择标记。

通过JS附加到HTML

2 个答案: