javascript - 服务器端数据表搜索框样式

Question

我注意到数据表的搜索和显示输入卡在 <label> 内标签。当我尝试从源 JavaScript 中删除标签标记时，输入消失了。我可能做错了，但有没有办法删除它，以便我可以调整其宽度并使其符合我的动态列大小？

这是我正在谈论的部分(来自源 JavaScript 文件)

function pb(a) {
        var b = a.oClasses,
            c = a.sTableId,
            d = a.oLanguage,
            e = a.oPreviousSearch,
            f = a.aanFeatures,
            g = '<input type="search" class="' + b.sFilterInput + '"/>',
            j = d.sSearch,
            j = j.match(/_INPUT_/) ? j.replace("_INPUT_", g) : j + g,
            b = h("<div/>", {
                id: !f.f ? c + "_filter" : null,
                "class": b.sFilter
            }).append(h("<label/>").append(j)),
            f = function() {
                var b = !this.value ?
                    "" : this.value;
                b != e.sSearch && (fa(a, {
                    sSearch: b,
                    bRegex: e.bRegex,
                    bSmart: e.bSmart,
                    bCaseInsensitive: e.bCaseInsensitive
                }), a._iDisplayStart = 0, O(a))
            },
            g = null !== a.searchDelay ? a.searchDelay : "ssp" === y(a) ? 400 : 0,
            i = h("input", b).val(e.sSearch).attr("placeholder", d.sSearchPlaceholder).bind("keyup.DT search.DT input.DT paste.DT cut.DT", g ? Oa(f, g) : f).bind("keypress.DT", function(a) {
                if (13 == a.keyCode) return !1
            }).attr("aria-controls", c);
        h(a.nTable).on("search.dt.DT", function(b, c) {
            if (a === c) try {
                i[0] !== I.activeElement && i.val(e.sSearch)
            } catch (d) {}
        });
        return b[0]
    }

页面加载时的代码

<div class="row">
    <div class="col-sm-12">
        <div id="table_filter" class="dataTables_filter pull-left">
            <label>
                <input type="search" class="form-control input-sm" placeholder="Search" aria-controls="table">
            </label>
        </div>
    </div>
</div>

看看标签下的搜索输入怎么样？我想知道如何删除它，以便它符合我的列大小。

Answer 1

使用下面的代码从搜索框中删除label节点。

var table = $('#example').DataTable({
   initComplete: function(){
      $('.dataTables_filter label').children().unwrap('<label/>');
   }
});

参见this example用于代码和演示。