替换没有完整类名的类名

Question

好吧，我正在尝试使用 jQuery 和 bootstrap 制作一个 PHP 页面构建器。

除了能够看到列大小的变化之外，我几乎可以正常工作。

我的问题是我不确定如何替换列大小类变量，该变量可能介于 col-lg-1 到 col-lg-12 之间

所以使用 jquery 我希望能够做到以下几点。

1. 根据类获取当前列大小：所以如果列是col-lg-4我想得到4
2. 根据用户选择的方向将 4 替换为 3 或 5。
3. 删除类col-lg-4并添加类col-lg-3或col-lg-5

通过这种方式，用户可以在屏幕上看到该列的大小。

提供更多信息。这是HTML

<div class="col-lg-4 bs-example-popover">
    <div class="popover" style="width:100%;">
        <h3 class="popover-title">[Module Title] <button type="button" class="close">&times;</button></h3>
        <div class="popover-content">
            <p>[Module Description]</p>
            <ul class="list-unstyled">
                <li class="pull-right"><button class="btn btn-default btn-xs"><span class="icon-icomoon-arrow-right"></span></button></li>
                <li class="pull-right">&nbsp;</li>
                <li class="pull-right"><button class="btn btn-default btn-xs"><span class="icon-icomoon-arrow-left"></span></button></li>
                <li>&nbsp;</li>
            </ul>
        </div>
    </div>
</div><!-- /column -->

我的基本 JS 将获得父级和按钮。但是我不知道如何只获取类的大小，然后加减，最后替换类。

$('.page-builder-column ul li .btn').on('click', function(e) {
    e.preventDefault();
    var _btn = $(this).find('span'),
        _parent = $(this).parents().eq(4);
    if (_btn.hasClass('icon-icomoon-arrow-right')) {
        console.log('larger');
    }else{
        console.log('smaller');
    }
    console.log(_parent.hasClass('col-lg-*'));
});

Answer 1

您可以执行以下操作：

_parent.attr('class').match(/\d+/)[0]

这将返回4