Question

基本上我试图让用户生成具有特定数量的列表条目的列表。如果他输入数字＆＃34; 50＆＃34;，我想自动生成一个包含50个列表条目的列表。

我现在正在使用Jade和Bootstrap。

我的代码看起来像这样，但显然不起作用。有没有简单的方法/改变来实现我的目标，还是我完全走错了轨道？按下＆＃34;生成按钮＆＃34;会发生第一次出现错误。因为它无法找到函数＆＃34;生成＆＃34;。

h1 1D Lists

    form(role="form")
        div.form-group
            label(for="itemsNumber") How many List Items?
            input(type="number", class="form-control", placeholder="Number of List Items", id="itemsNumber")
        div.form-group
            label(for="alignment") Alignment?
            select.form-control
                option Horizontal
                option Vertical
        button.generate(type="submit", class="btn btn-default", onclick="generate()") Generate


    - var generate = function() {
    - alert("generated!")
    -   var itemsNumber = document.getElementById("itemsNumber").value;
    -   $("list").html("+list(itemsNumber)");
    - }

    mixin list(number)
        div.list        
            ul.list-group.level1
                a.list-group-item.listhead
                    i.fa.fa-list  My List
                - for (var i = 0; i < number; ++i){
                    a(href="#").list-group-item Entry #{i}

                - }

Answer 1

您的生成函数仅在玉编译时时可用，
不是 javascript执行时间（在浏览器中）

所以请将您的函数放入<script>标记中，并使用script.

添加到jade中

使用基于输入的Jade生成HTML

1 个答案: