4

Хорошо, поэтому я пытаюсь создать построитель страниц PHP, используя jQuery и bootstrap.заменить имя класса без полного имени класса

У меня почти все работает, кроме возможности увидеть изменение размера столбца.

Моя проблема в том, что я не знаю, как заменить переменную класса размер столбца, который может быть что угодно между 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-*')); 
}); 
+0

на то, что отправной точкой? Обработчик событий где-то в столбце? –

+0

Да, у меня есть две кнопки. Когда вы нажимаете на кнопку, они говорят сценарию сжимать коробку или увеличивать ее. В настоящее время только консольный журнал –

+0

@ T.J.Crowder добавил базовые HTML и JS, чтобы показать пример. –

ответ

1

Вы можете сделать следующее:

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

который будет возвращать 4

Смежные вопросы