Question

我想知道是否有办法改变标记的popUp的内容，而不必重写已经存在的所有html，我的意思是，我想切换一个内部元素之一的类popUp，似乎该类存在于DOM中，并且它向右切换，但在我关闭标记的popUp之后，返回到它的先前状态，因为如果未应用toggle，我相信是因为我需要更改popUp的初始HTML，我想这样做而不必重写我已经构建的所有html，并且因为是一个非常重的html，重写所有内容很复杂，我尝试使用update（）方法，但是不起作用，希望有人能帮助我，

var objeto = Layerpints._layers;
  for(r in objeto){
    var html = Layerpints._layers[r]._popup._content;
    var html_parse = $.parseHTML(html);
    var up_tick    = $(html_parse).find('.up_tick');
  }
  $(up_tick).each(function(e){
      var id_pint_name = $(this).attr('name');
      if(id == id_pint_name){
        if($(this).hasClass('text-info')){
          console.log("remove class");
          $(this).removeClass('text-info');
          Layerpints._layers[r]._popup.update();
        }else{
          console.log("add Class");
          $(this).addClass('text-info');
          Layerpints._layers[r]._popup.update();
        }
      }else{
        console.log("do nothing");
      }
  });

这是我试图使用的代码希望有人可以提供帮助，谢谢和问候！

Answer 1

不知何故，我设法通过将update（）方法更改为setContent（）方法来修复它

var objeto = Layerpints._layers;
  for(r in objeto){
    var html = Layerpints._layers[r]._popup._content;
    var html_parse = $.parseHTML(html);
    var up_tick    = $(html_parse).find('.up_tick');
  }
  $(up_tick).each(function(e){
    var id_pint_name = $(this).attr('name');
      if(id == id_pint_name){
        if($(this).hasClass('text-info')){
          $(this).removeClass('text-info');
          Layerpints._layers[r]._popup.setContent();
        }else{
          $(this).addClass('text-info');
          Layerpints._layers[r]._popup.setContent();
        }
      }else{
        console.log("do nothing");
      }
  });

事实是我不知道为什么这是有效的，因为我相信setContent（）会清空我的popUp但它没有，也许有人可以进一步解释，谢谢

Answer 2

充分利用L.Util.Template：

简单的模板工具，接受表格＆＃39; Hello {a}，{b}＆＃39;和{a：＆＃39; foo＆＃39;，b：＆＃39; bar＆＃39;}之类的数据对象返回已计算的字符串（＆＃39; Hello foo，bar＆＃39;）。您还可以为数据值指定函数而不是字符串 - 它们将被评估为将数据作为参数传递。

http://leafletjs.com/reference.html#util-template

L.Util.template('Hello {w}', {w: 'world'});

更新标记的popUp内容，而无需重写所有HTML小册子

2 个答案: