在一个Div中添加一个html

Question

我想将一些模板加载到div元素中。

每次点击一个模板图片时，都应将HTML模板加载到#contenidor_iframe div元素中。

这是需要加载模板的容器：

<div id="contenidor_iframe"></div>

这是模板代码：

HTML

<link rel="stylesheet" type="text/css" href="../pluggins/dropzone/dropzone.css"> 
<div style=" margin:auto; text-align:center; ">
    <form action="http://www.torrentplease.com/dropzone.php" class="dropzone dz-clickable" id="casella2"  style=" overflow:hidden;border:#FC3 2px dashed; width:300px; height:300px; display:inline-block; margin:10px;  " ></form>    
    <form action="http://www.torrentplease.com/dropzone.php" class="dropzone dz-clickable" id="casella3"  style="border:#FC3 2px dashed; width:30%; height:109px; z-index:9999999 ; display:inline-block; "></form>     
</div>
<!-- ----------   DROPZONE  plugin   ------------------------   -->
<script src="../pluggins/dropzone/dropzone.js"></script>

这是加载模板的脚本：

的JavaScript

$("#caixa_plantilles").children().click(function(event) {
    var id_plantilla = event.target.id; // New selected target
    $.get('../plantilles/'+id_plantilla+'.html', function(data) {
        $('#contenidor_iframe').html(data);
        // alert('Load was performed.');
    });
});

主文档有Jquery库，但没有问题，因为如果我打开plantilla1.html（模板）它就可以完美运行。

Answer 1

围绕Javascript。

$(document).ready(function(){
  $("#caixa_plantilles").children().click(function(event) {
    var id_plantilla = event.target.id; // New selected target
    $.get('../plantilles/'+id_plantilla+'.html', function(data) {
        $('#contenidor_iframe').html(data);
    });
  });
});