如何动态更改jquery mobile中的固定标头答案

【问题标题】：How to change fixed header in jquery mobile dynamically如何动态更改jquery mobile中的固定标头
【发布时间】：2014-04-01 08:40:00
【问题描述】：

我在 Jquery 移动和 Cordova 驱动的应用程序中有一个固定的标题。所以data-position="fixed"

<div data-position="fixed" data-role="header" data-theme='b' id="mainHeader">
    <h1>XXXXXXXXXX</h1>
    <img src="img/banner.png" style="width:100%;" />

    <div style="height:40px; width:100%; text-align:center; font-size:20px; background-color:#809710;">
    Welcome
    </div>
</div><!--Header-->

大标题不是吗！ :) 现在，当移动方向发生变化时，这意味着当它从纵向变为横向时，我想更改此data-position，以便不再修复此问题。然后当它再次回到纵向时，它应该再次被修复。

我可以控制变化的方向检测。问题是如何更改此数据位置属性并使其固定或不固定。

我试过了

var col = $('#mainHeader');
col.data('position','');

没用。任何人都可以帮助实现这一目标吗？

更新： JSFiddle

【问题讨论】：

在新样式应用后尝试添加 col.trigger('pagecreate')
@Regent 尝试不工作jsfiddle.net/gsujU
您使用的是哪个 jQM 版本？
@Omar 1.4.0。问题已经解决了。

标签： android jquery ios jquery-mobile cordova

【解决方案1】：

试试这个

$(document).on('click', "#btn", function () {
    alert("OK");
    $('#mainHeader').removeClass('ui-header-fixed');

});
$(document).on('click', "#abtn", function () {
    alert("OK");
    $('#mainHeader').addClass('ui-header-fixed');

});

DEMO

【讨论】：

不，标题没有移动。仍然是固定的。
完美。谢谢你。 :)
@AtanuCSE 很高兴为您提供帮助;-)