ExpressJS:使用Javascript注入包含在Jade中

时间:2013-03-25 14:46:52

标签: express pug

说我有以下文件

包括/ person.jade

.person
  .name= name
  .desc= desc

现在我想在我的页面上有一个按钮,当单击它时,将前一个按钮注入文档。我想要这个,因为我需要在页面中添加人员。我该怎么做呢?

在这种情况下我应该只使用HTML文件吗?

2 个答案:

答案 0 :(得分:1)

Jade在服务器端渲染。所以你应该用ajax调用方法,它将返回渲染的html。另一个选择是使用JavaScript执行此操作:

function addPerson(name, desc, parentId){
    var container = document.createElement('div');
    container.className = 'person';
    var nameContainer = document.createElement('div');
    nameContainer.className = 'name';
    nameContainer.innerHTML = name;
    container.appendChild(nameContainer);
    var descContainer = document.createElement('div');
    descContainer.className = 'desc';
    descContainer.innerHTML = desc;
    container.appendChild(descContainer);
    var parent = document.getElementById(parentId);
    parent.appendChild(container);
}

玉:

#personContainer
input(onclick="addPerson('#{name}', '#{desc}', 'personContainer');", type="button")

答案 1 :(得分:0)

与上一个示例类似,我使用express来为自己的url中的人输入主持Jade HTML ...

self.app.get('/person/:name/:desc',adddoc.person2);

当然,person2实现只是Jade的渲染。

.person
  mixin personField(desc,name,valuefname,valuelname)

然后在我的Javascript(使用JQuery)

function stump(name, desc){
  $.get(
    "/person/"+desc+"/"+name,
    "{}",
    function(data) {
      var $parents = $( "#parents" );
      $parents.append($(data).filter('.person'));
    },
    "html"
  );
}