Question

我有div元素并且有一个类，我想使用该类创建多个div，但我不想创建嵌套div，我想在外面使用javascript创建div，我使用了append属性，但是它的创建下面的嵌套div是html，因为我需要帮助

 //have this div
 <div data-bind="dynamicDiv"  class="one"></div>

 //need to create multiple div 

    //Knockoutjs && javascript//

 ko.bindingHandlers.dynamicDiv = {
    init: function (element, valueAccessor) {
        var parentclassName = element.className;         
            lastId += 1;

    ///it is creating nested div, want to create outside of parentclass not inside the parent class
           $element.append(DivHtml(lastId,parentclassName));          
  },
  };

 function DivHtml(lastId,parentclassName) {
       Newdiv = document.createElement('div');
        Newdiv.id = "divId_"+lastId
        document.querySelector("." + parentclassName).appendChild(Newdiv)
  }

Answer 1

修复了您当前的代码：

在DivHtml中，第三行应为return NewDiv
init应使用element.parentElement

appendChild

您永远不会定义$element，它应该只是element或$(element)

但即使你解决了这个问题，我也不会理解你想要实现的目标。

您的示例并未真正说明您为何需要自定义绑定处理程序。在我看来，淘汰赛的默认绑定应该足够了：

<div data-bind="attr: { id: 'divId_' + ++lastId }" class="one"></div>

如果您需要动态复制班级名称，如果我是您，我会在视图模型中处理这个问题。请查看template和foreach绑定。

＆＃13;

var className = "one";
var idPrefix = "divId_";
var nrOfElements = 5;
var elements = [];

for (var i = 0; i < nrOfElements; i += 1) {
   elements.push({
     className: className,
     id: idPrefix + i
   });
};

ko.applyBindings({items: elements });

＆＃13;

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script>


<div data-bind="foreach: elements">
  <div data-bind="attr: { id: id, 'class': className }, text: id"></div>
</div>

＆＃13;

使用javascript动态创建多个div

1 个答案: