Question

更新：我犯了一个错误 - 文本右边应该在标签上。

我正在尝试做两件事：

将顶部搜索框向右滑动（只需将课程添加到＆＃34的6栏右侧div;右键和＃34;）
将一个类添加到包含寻呼机文本的行中的单元格以及寻呼机本身（左侧为col-sm-5，右侧为col-sm-7），这样我可以更好地控制边距从我目前的样式表中移动。

棘手的部分是我现在没有ID或类可以在DOM中找到这些点。 这是似乎由数据表生成的代码：

1）

<div class="row">
    <div class="col-sm-6">
        <div id="ReportTable_length" class="dataTables_length">
            <label">Show <select class="form-control input-sm" aria-controls="ReportTable" name="ReportTable_length"><option value="10">10</option><option value="25">25</option><option value="50">50</option><option value="100">100</option><option value="-1">All</option></select> entries</label>
        </div>
    </div>
    <div class="col-sm-6">
        <div class="dataTables_filter" id="ReportTable_filter">
            <label **(ADD class="text-right" HERE)**>Search:<input aria-controls="ReportTable" placeholder="" class="form-control input-sm" type="search"></label>
        </div>
    </div>
</div>

2）

<div class="row">
    <div class="col-sm-5 **NEED-CLASS-HERE**">
      <div aria-live="polite" role="status" id="ReportTable_info" class="dataTables_info">Showing 1 to 6 of 6 entries</div>
   </div>
   <div class="col-sm-7 **NEED-CLASS-HERE**">
      <div id="ReportTable_paginate" class="dataTables_paginate paging_simple_numbers"><ul class="pagination"><li id="ReportTable_previous" class="paginate_button previous disabled"><a tabindex="0" data-dt-idx="0" aria-controls="ReportTable" href="#">Previous</a></li><li class="paginate_button active"><a tabindex="0" data-dt-idx="1" aria-controls="ReportTable" href="#">1</a></li><li id="ReportTable_next" class="paginate_button next disabled"><a tabindex="0" data-dt-idx="2" aria-controls="ReportTable" href="#">Next</a></li></ul></div>
   </div>
</div>

感谢您的帮助！

丹尼斯

Answer 1

如果您有Id，则可以获取父级和addClass或修改...例如：

1）

$("#ReportTable_filter").find('label').css("text-align","right");// for example

2）

$("#ReportTable_info").parent().addClass('MyClass');//Change by your class
$("#ReportTable_paginate").parent().addClass('MyClass');//Change by your Class

示例：https://jsfiddle.net/cmedina/7kfmyw6x/14/

Answer 2

这是解决方案。确保在数据表声明之后调用它们！洛尔。

$("#ReportTable_filter").find('label').css("text-align", "right");
$("#ReportTable_info").parent().addClass('MyClass');
$("#ReportTable_paginate").parent().addClass('MyClass')

Bootstrap DataTables - 配置热门搜索和底部寻呼机

更新：我犯了一个错误 - 文本右边应该在标签上。

2 个答案: