jQuery-Mobile controlgroup не отображает

Question

Я пытаюсь вставить виджет контрольной группы на страницу, но когда я вызываю controlgroup(), исправление неверно. Все ожидаемые кнопки отображаются как ссылки (Chrome 38.0.2125.101 m).

Я предполагаю, что это то, что я делаю, а не ошибка, так как демонстрации, похоже, работают хорошо. Есть ли какой-то шаг, который мне не хватает?

Вот мой пример кода: http://jsfiddle.net/Lwr4mm4v/5/

function Body() { 
    this.left_buttons = $('<div data-role="controlgroup"></div>').appendTo('div'); 

    this.save_button = $('<a href=# data-role="button" id="save">save description</a>').appendTo(this.left_buttons); 
    this.run_button = $('<a href=# data-role="button" id=\"exec\">run description</a>').appendTo(this.left_buttons); 
    this.stop_button = $('<a href=# data-role="button" id=\"stop\">stop description</a>').appendTo(this.left_buttons); 
    this.add_button = $('<a href=# data-role="button" id="add">add state</a>').appendTo(this.left_buttons); 

    this.left_buttons.controlgroup(); 
} 

var test = new Body(); 

Благодаря

Answer 1

Вы используете старую версию JQM, которая требует призывающую дополнительный метод .trigger("create").

Рекомендуется использовать JQM 1.4.4, где вам не нужно использовать какие-либо дополнительные методы.

• JQM 1,3: http://jsfiddle.net/Lwr4mm4v/6/

• JQM 1,4: http://jsfiddle.net/4dfu9vtu/

Answer 2

Глядя на последнюю документацию, один добавляет класс = "щ-BTN", чтобы закрепить элементы, которые вы хотите используйте как кнопки.

Ниже приведен пример кода, который достигает своей цели:

function Body() { 
    this.left_buttons = $('<div data-role="controlgroup" data-type="horizontal"></div>').appendTo('#root'); 

    this.save_button = $('<a href="#" id="save" class="ui-btn ui-corner-all">Save</a>').appendTo(this.left_buttons); 
    this.run_button = $('<a href="#" id="exec" class="ui-btn ui-corner-all">Run</a>').appendTo(this.left_buttons); 
    this.stop_button = $('<a href="#" id="stop" class="ui-btn ui-corner-all">Stop</a>').appendTo(this.left_buttons); 
    this.add_button = $('<a href="#" id="add" class="ui-btn ui-corner-all">Add</a>').appendTo(this.left_buttons); 

    this.left_buttons.controlgroup(); 
} 

уаг тест = новый Body();

Я построил новый образец иллюстративный jsFiddle, который можно найти здесь:

jsFiddle

Смотрите также эту документацию по использованию "Controlgroup Widget":

Control Group Widget