Question

在Jquery mobile中，我尝试用一些按钮替换我的标题。我使用jquery中的html（）函数来完成它。

问题是按钮上的图标丢失了，看起来不像原来的div ..

我该如何解决？ Fiddle

HTML ：

<div data-role="page" id="index">
      <div id="header" data-theme="b" data-role="header">
          <h1>replace this with some buttons</h1>
      </div>

      <div data-role="content">
          <div id="map"></div>
      </div>
</div>

<!-- div to instert-->
<span id="downBut"><center>
  <button type="submit" id="down" style="width: 110px" data-mini="true"  data-theme="a" data-transition="pop" data-icon="carat-d">Download</button>
  <button type="submit" id="down" style="width: 110px" data-mini="true"  data-theme="a" data-transition="pop" data-icon="delete">cancel</button>
</center></span>

的Javascript ：

// make the from header buttons
$("#header").html($("#downBut"));

的CSS ：

.ui-header {
    height: 40px;
}

.ui-content {
    position: absolute;
    top: 40px;
    right: 0;
    bottom: 0;
    left: 0;
    padding: 0 !important;
    margin: 0;
}
h1 {
    margin: 0 auto;
}

Answer 1

在用按钮替换html后，您必须为create div调用header。

$('#header').html($('#downBut'));
$('#header').trigger('create');

<强> Working JSFiddle

jquery html（）;没有按钮样式

1 个答案: