Question

我正在使用JQuery创建两个按钮：

      mapbutton = '<a class="mapbtn" rel="external" data-role="button" href="map.html?longlat='+ coords +' ">Map</a>';
      $('.event').append(mapbutton);

      var input = '<a href="#" data-role="button" class="save_event">Save to Planner</a>';
      $('.event').append(input);

我添加了所需的data-role="button"以使JQuery Mobile对其进行样式设置，但仍然像普通链接一样显示。

我猜这是因为JQM在脚本运行之前设置了DOM元素的样式。

是否有人知道如何改变这一点，以便JQM也为这些动态创建的元素设置样式？

Answer 1

您可以使用.button()

在动态创建的元素上调用按钮小部件以显示为JQM按钮小部件

var mapbutton = '<a class="mapbtn" rel="external" data-role="button" href="map.html?longlat=' + coords + ' ">Map</a>';

$('.event').append($(mapbutton).button());

var input = '<a href="#" data-role="button" class="save_event">Save to Planner</a>';
$('.event').append($(input).button());

Demo

请参阅Documentation

JQuery Mobile：样式动态创建元素

1 个答案:

Demo