Question

我正在使用引导程序数据表，并且我具有搜索输入，无论执行什么操作都不会删除搜索文本并添加占位符。我在堆栈和google上都看到过示例，但这没有帮助。

我相信这是搜索输入的js：

function _fnFeatureHtmlFilter ( settings )
    {
        var classes = settings.oClasses;
        var tableId = settings.sTableId;
        var language = settings.oLanguage;
        var previousSearch = settings.oPreviousSearch;
        var features = settings.aanFeatures;
        var input = '<input type="search" class="'+classes.sFilterInput+'"/>';

        var str = language.sSearch;
        str = str.match(/_INPUT_/) ?
            str.replace('_INPUT_', input) :
            str+input;

        var filter = $('<div/>', {
                'id': ! features.f ? tableId+'_filter' : null,
                'class': classes.sFilter
            } )
            .append( $('<label/>' ).append( str ) );

        var searchFn = function() {
            /* Update all other filter input elements for the new display */
            var n = features.f;
            var val = !this.value ? "" : this.value; // mental IE8 fix :-(

            /* Now do the filter */
            if ( val != previousSearch.sSearch ) {
                _fnFilterComplete( settings, {
                    "sSearch": val,
                    "bRegex": previousSearch.bRegex,
                    "bSmart": previousSearch.bSmart ,
                    "bCaseInsensitive": previousSearch.bCaseInsensitive
                } );

                // Need to redraw, without resorting
                settings._iDisplayStart = 0;
                _fnDraw( settings );
            }
        };
        var jqFilter = $('input', filter)
            .val( previousSearch.sSearch )
            .attr( 'placeholder', language.sSearchPlaceholder )
            .bind(
                'keyup.DT search.DT input.DT paste.DT cut.DT',
                _fnDataSource( settings ) === 'ssp' ?
                    _fnThrottle( searchFn, 400 ):
                    searchFn
            )
            .bind( 'keypress.DT', function(e) {
                /* Prevent form submission */
                if ( e.keyCode == 13 ) {
                    return false;
                }
            } )
            .attr('aria-controls', tableId);

        // Update the input elements whenever the table is filtered
        $(settings.nTable).on( 'search.dt.DT', function ( ev, s ) {
            if ( settings === s ) {
                // IE9 throws an 'unknown error' if document.activeElement is used
                // inside an iframe or frame...
                try {
                    if ( jqFilter[0] !== document.activeElement ) {
                        jqFilter.val( previousSearch.sSearch );
                    }
                }
                catch ( e ) {}
            }
        } );

        return filter[0];
    }

如您所知，数据表未以HTML显示，因此它的js也是如此。

How it looks, look at the search input

How I want it to look

Answer 1

您可以使用以下代码

oLanguage: {
            "sSearch": ""
        },

对于占位符，请输入以下代码

$('.dataTables_filter input').attr("placeholder", "search...");

Bootstrap数据表搜索输入不会更改

1 个答案: