Question

我有一个多页申请。当我单击第1页上的按钮时，我将导航到第2页 - 不幸的是，第2页上的按钮（位于相同位置）会自动着色为“悬停”。有一个简单的解决方法吗？

enter image description here

我正在使用 jquery.mobile-1.4.0.min.js和的jquery-2.0.0.min.js

非常感谢您的帮助！ HTLM

        <!-- Page: CalendarScreen  -->
    <!-- Page: CalendarScreen  -->
    <!-- Page: CalendarScreen  -->
    <!-- Page: CalendarScreen  -->
    <!-- Page: CalendarScreen  -->
    <!-- Page: CalendarScreen  -->
    <!-- Page: CalendarScreen  -->
    <div data-role="page" id="calendarScreen" data-dom-cache="true">
        <!-- Header -->
        <div data-role="header" data-position="fixed" data-tap-toggle="false">
            <div class="ui-grid-b" style="background-color: white">
                <div class="ui-block-a"><img class="dataMigLogo"></div>
                <div class="ui-block-b"><img class="dataMigBlueLine"></div>
            </div>
            <div id="lb_sync" class="whiteTextNoShadow"><img src="../../res/icon/upload.png" style="height:74px;"><br>Synchronisieren</div>
            <div id="lb_info" class="whiteTextNoShadow">Letzter Sync:<br><div id="syncInfoDate"></div><div id="syncInfoTime"></div></div>
        </div>
        <div data-role="content" id="calendarContent">
        </div>
        <div id="calendarPlugin"></div>
        <!-- Neu eingefuegt Daniel -->
        <div data-role="footer" id="ui-footer-div" data-position="fixed" data-tap-toggle="false">
            <div id="fiveButtons" class="center-wrapper" style="margin-bottom:10px float:left "> 
                <div class="b"><button id="liBtn_navbar_monthlyApp" style="margin-left:20px" class="c ui-btn ui-btn-b ui-icon-bullets ui-btn-icon-left">Übersicht</button></div>
                <div class="b"><button id="liBtn_navbar_settApp" class="c ui-btn ui-btn-b ui-icon-gear ui-btn-icon-left">Einstellungen</button></div>
            </div>
        </div>
    </div>
    <!-- Page: SettingScreen  -->
    <!-- Page: SettingScreen  -->
    <!-- Page: SettingScreen  -->
    <!-- Page: SettingScreen  -->
    <!-- Page: SettingScreen  -->
    <!-- Page: SettingScreen  -->
    <!-- Page: SettingScreen  -->
    <div data-role="page" id="settingScreen" data-dom-cache="true">
        <!-- Header -->
        <div data-role="header" class="fixedHeader" data-tap-toggle="false">
            <div class="ui-grid-b" style="background-color: white">
                <div class="ui-block-a"><img class="dataMigLogo"></div>
                <div class="ui-block-b"><img class="dataMigBlueLine"></div>
            </div>
            <label class="lb_info"></label>
        </div>
        <div data-role="content">
            <div style="margin-left: 3%; width: 93%; padding-bottom: 120px; padding-top: 120px;">
                <h1>Übersicht:</h1>
                <!-- Tabelle, die 2 Spalten hat -->
                <div class="div30">SOME CONTENT</div>
            </div>
        </div>
        <div data-role="footer" id="ui-footer-div" class="fixedFooter" data-tap-toggle="false">
                            <div id="fiveButtons" class="center-wrapper" style="margin-bottom:10px float:left "> 
                <div class="b"><button id="liBtn_navbar_backSettings" style="margin-left:20px" class="c ui-btn ui-btn-b ui-icon-back ui-btn-icon-left">Zurück</button></div>
                <div class="b"><button id="liBtn_navbar_saveSettings" class="c ui-btn ui-btn-b ui-icon-check ui-btn-icon-left">Speichern</button></div>
            </div>
        </div>
    </div>

JavaScript：

//Page change to Calendar -> Setting
$('#liBtn_navbar_settApp').tap(function()   {
    setSettingValues();
    $.mobile.changePage("#settingScreen", {transition: "slide"});
    $("#collSettings").trigger("collapse");
    setHeadValue("Einstellungen. Hier können alle relevanten Einstellungen vorgenommen werden.", "white");
});

按钮的css没有变化！

Answer 1

我认为你需要将buttonElement:visited的css更改为默认的css样式。并将onclick css更改放置到buttonElement:active。

不确定，我们需要看看你的css和你改变按钮风格的方法。你使用普通的CSS，jquery还是javascript？

未点击按钮获取彩色

1 个答案: