如何在一个动态的div中放值或者html页面（handlebars）

ゝ一纸荒年。 2022-02-25 16:07 232阅读 0赞

需求：要将数据或者html片段放入多条栏目的其中一条中（点击对应的栏目然后点击html按钮时都在那个栏目中操作）

1.这里时勾选动作  
`$(document).on("click","input",function() { let value = $(this).val(); //字段值 let temp = $(this).parents(".field-info").prev(".field-name").attr("id"); for (var i=0;i<checkboxTemp.length; i++){ if(checkboxTemp[i].value === temp){ var box = checkboxTemp[i].content; console.log(box); //存放某个模板里 选中的复选框 name值 for (var j=0;j<box.length;j++){ if(box[j].label === value){ box[j].checked = box[j].checked === false; } } } } renderEditTemp(json); });`

2.勾选需要的html片段

function renderEditTemp(list){
                 let tpl_field = require('../views/product-field-manage/tpl/template-edit-minchange.tpl');
                 var temp_edit = Handlebars.compile(tpl_field);
                var html_edit = temp_edit(list);
                var templateNeedId = $("#hiddenTemplateId").val();
                 $('div').find('.template-title').each(function () {
                     var id  = $(this).attr("id");
                     if (id==templateNeedId){
                         $(this).next("div").html(html_edit);
                     }
                 });
    
                dragSort();/*用来调用拖拉的函数*/
            }

3.对应的栏目：

{
       {#each json}}
    {
       {#each data}}
        <div id="">
            <div class="template-title" id="{
       {dictionary}}">{
       {category}}<i class="iconfont  J_tempDelete" style="margin: 0;color: #EE4451;font-size: 16px"></i></div>
                <div class="block-box" style="margin-bottom:0px"  id="mincategory">
            </div>
        </div>
    {
       {/each}}
    
    {
       {/each}}

步骤：  
1.先将点击栏目设置监听，当对应栏目被点击时，将其中具有特殊性的数据传到一个隐藏域中：

//设置模板的监听
            //用来存放每次点击之后模板的id
            var templatetitle;
            $(document).on("click",".template-title",function(){
                var id=$(this).attr("id");
                $("#hiddenTemplateId").val(id);   //放置在一个html中的隐藏域中
               // console.log (id)
                templatetitle=id;
            });

2.当勾选模块时，要选择放置对应的html的元素：

function renderEditTemp(list){
                 let tpl_field = require('../views/product-field-manage/tpl/template-edit-minchange.tpl');
                 var temp_edit = Handlebars.compile(tpl_field);
                var html_edit = temp_edit(list);
    //这里开始就是获取那个对应栏目div的过程
                 //1.获取隐藏域中的值
                var templateNeedId = $("#hiddenTemplateId").val();
                //利用循环寻找class为.template-title的div，当找到对用栏目的div时，将对应的tpl放入即可
                 $('div').find('.template-title').each(function () {
                     var id  = $(this).attr("id");
                     if (id==templateNeedId){
                         $(this).next("div").html(html_edit);
                     }
                 });
    
                dragSort();/*用来调用拖拉的函数*/
            }

发表评论取消回复

表情：

评论列表（有 0 条评论，232人围观）

还没有评论，来说两句吧...

相关阅读

相关如何在HTML标签内嵌入一个HTML页面

关于iframe标签用法就不提了，现在很少人用了吧。直接js实现很舒服，用异步请求的方法加载为标签内添加内容，看代码吧： //为header标签中加载he

朴灿烈づ我的快乐病毒、/ 2023年06月27日 03:51/ 0 赞/ 51 阅读

相关一个html嵌入另一个html页面,html – 两个div：一个固定,另一个拉伸

我试图完成这个：但是我无法让两个中间的角色玩得很好.如果我们将它们设置为相对数字(30％和70％),它将“工作”,但是当用户更改浏览器窗口宽度时,左侧div会更改大小.

谁践踏了优雅/ 2022年10月06日 05:53/ 0 赞/ 47 阅读

相关动态创建html页面,如何动态创建html页面？

这是从该链接：注：jQuery开发团队已经决定不采取这个插件过去的测试版。它不再被积极开发或维护。文档暂时保留(仅供参考)，直到准备好合适的替换模板插件。我不能写

傷城~/ 2022年10月06日 04:56/ 0 赞/ 59 阅读

相关 html位于中心,html – 将输入框放在div的中心

捕获的是输入元素是内联的。在将其定位到中心之前，我们必须阻止(显示：块)：margin：0 auto。请看下面的代码： div.wrapper \{ width: 30

我会带着你远行/ 2022年10月06日 00:57/ 0 赞/ 44 阅读

相关 ASP.NET在RENDER中加载HTML来动态生成或者修改页面

有时候在项目中需要根据实际传过来的参数来生成不同个数的控件来摆放在页面上，这时候可以重写页面 Render方法来达到目的。下面提供一个示例来实现，代码如下: //生成要重

￡神魔★判官ぃ/ 2022年08月19日 11:15/ 0 赞/ 101 阅读

相关 html如何让其中一个div浮在另一个div上面

（1）方法：设置div样式 z-index:auto auto可定义为一个值(整数数字)，越大代表越置前，如可定义为： z-index:999。前

水深无声/ 2022年05月31日 01:16/ 0 赞/ 798 阅读

相关 HTML网页下，在div标签中嵌套其他html页面

主页面为main.html,点击在div添加html按钮id为btn, div的id为viewDiv，要插入的本地html为new.html。方法一：基于Jquery的

朱雀/ 2022年05月16日 13:08/ 0 赞/ 414 阅读

相关如何将一个HTML页面嵌套在另一个页面中

[如何将一个HTML页面嵌套在另一个页面中][HTML] 2010-05-05 16:45 559人阅读 [ 评论][Link 1](1) [收藏][Link 2] [

﹏ヽ暗。殇╰゛Y/ 2022年04月11日 14:51/ 0 赞/ 599 阅读

相关如何在一个动态的div中放值或者html页面（handlebars）

需求：要将数据或者html片段放入多条栏目的其中一条中（点击对应的栏目然后点击html按钮时都在那个栏目中操作） 1.这里时勾选动作 `$(document).on("c

ゝ一纸荒年。/ 2022年02月25日 16:07/ 0 赞/ 233 阅读

相关一个html页面如何包含另一个html页面

我的qq 2038373094 使用教程一套系统包含很多页面，但是许多的页面的头部或者是底部都是一样的，这个时候，如果用一个公共的页面，在这个公共的页面里面写公

电玩女神/ 2022年02月04日 13:13/ 0 赞/ 494 阅读