Question

我有以下的jquery

var wrapperClass        = 'tableAccordionWrapper';
var template            = 'tableInput.html';

addTableInput = function(){
    var int;
    var wrapper = $('<li />');
    wrapper.addClass(wrapperClass);
    wrapper.attr('id','table1');
    var href = $('<a href="#">Table xx</a>');
    var parentWrapper = $('#selectedTables .sub-content .input-controls');
    $.ajax({
        url:        template,
        dataType:   'html',
        success: function(data){
            wrapper.append(href);
            $(data).appendTo(wrapper).insertBefore(parentWrapper);
        },
        error: function(){
            console.log('Something went wrong')
        },
        complete: function(){
            int = $('.tableAccordionWrapper').length; 
            console.log(int);
        }
    });
}

正在将addClass函数传递给li元素。但奇怪的是不是attr add id。当我调试时，我可以看到id似乎暂时存在于节点但是退出调试，该元素只保留类名。

我甚至试过像这样链接这个函数：

wrapper.addClass(wrapperClass).attr('id','table1');

还尝试过：

wrapper.attr('tabindex','1');

查看该属性是否存在问题。但是只有classname似乎被传递给LI元素。

我还尝试在ajax成功中传递wrapper.attr('id','table1')函数并完成函数。

我的问题

我有一大块html构成了表单的一部分。在dom准备好时，通过ajax注入单个html块。用户可以插入其他块，此时我为表单元素创建一个包装器，我需要一些方法来计算当前元素，或者增加一个整数来添加到LI的ID，以便子元素将是唯一的。

如果这需要一个有效的jsfiddle示例，我可以尝试设置一个。

修改的

我想知道这是否与我在jquery中创建LI节点的方式有关？

var wrapper = $('<li />');

修改的

HTML块：

<label for="tableDescription1" class="control col-md-6">Table description
    <input type="text" name="tableDescription1" class="mandatory fullWidth">
</label>
<label for="rowCount1" class="control">Row count
    <input type="text" name="rowCount1" value="">
</label>
<p class="control">Is there a Pre-Environment</p>
<span class="controls-stacked">
    <label class="control radio">
        <input type="radio" name="preEnvironment1" type="radio" value="Y" class="hiddenInput" checked />
        <span class="control-indicator"></span>
        Yes
    </label>
    <label class="control radio">
        <input type="radio" name="preEnvironment1" type="radio" value="N" class="hiddenInput" />
        <span class="control-indicator"></span>
        No
    </label>
</span>

表单块中的名称是唯一的，因此当通过ajax添加新的html块时，它们需要递增。

例如，当注入第二个html块时，rowCount1需要递增到rowCount2。

Answer 1

问题：

您永远不会在页面中添加,。我假设这行是意味着来做到这一点：

wrapper

为了保留方法链，像appendTo(target)这样的jQuery方法不返回目标，而是返回前面的元素。考虑到这一点，您会注意到上面的示例实际上只是在做$(data).appendTo(wrapper).insertBefore(parentWrapper); - $(data).insertBefore(parentWrapper)没有达到目的。

我已this example进行演示。

解决方案：

尝试这样的事情：

appendTo

在这个例子中，我们已经改变了一些事情，以便整条线现在引用 wrapper.append(data).insertBefore(parentWrapper); ，而不是 wrapper

无法将动态id添加到jquery元素

1 个答案: