我有一个网页，它使用Ractive js并尝试使用特定类执行元素的脚本。请找到以下示例：
<body>
<div class='container'></div>
<div class='container'>Hello</div>
<script>
var ractive = new Ractive({
// The `el` option can be a node, an ID, or a CSS selector.
el: '.container',
oncomplete: function () {
console.log("22");
}
});
</script>
</body>
对于上面的代码，我只能在控制台中看到一个条目。为什么会这样？如何为具有容器作为类的所有元素执行oncomplete脚本？
问题是你不能用多个元素真正启动Ractive。这个想法是你在包装器上初始化Ractive，然后用partials构建你的页面。
如果您出于某种原因希望按照您的建议进行操作，可以在一个页面上创建多个Ractive实例，如下所示：http://jsfiddle.net/7yxnd5wb/1/
var ractive = new Ractive({
// The `el` option can be a node, an ID, or a CSS selector.
el: '.c1',
template: 'rendered 1',
onrender: function () {
console.log("11");
}
})
var ractive = new Ractive({
// The `el` option can be a node, an ID, or a CSS selector.
el: '.c2',
template: 'rendered 2',
onrender: function () {
console.log("22");
}
})
我相信使用css类选择器的选项是一个新选项，可能会令人困惑。大多数人似乎都在使用ID来进行此项使用。
如果你真的想基于类创建许多ractive实例，请考虑以下函数：http://jsfiddle.net/7yxnd5wb/2/
function ractive_class (class_selector) {
return $('.' + class_selector)
.toArray()
.map(function (element) {
return new Ractive({
el: element,
template: 'rendered',
onrender: function () {
console.log("rendered");
}
}
)
})
}
console.log(ractive_class('c'))