jquery - 将 html 添加到 Div

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);
    });
  });
});