按下时更改按钮主题

时间:2011-12-18 21:13:29

标签: javascript jquery button jquery-mobile

我正在尝试在按下时更改按钮的数据主题。

我在按钮的onClick处理程序中调用此JavaScript函数:

function changeNextButtonColor() {
    var nextButton = document.getElementById('next');
    nextButton.setAttribute('data-theme', 'a');
}

但主题并没有改变。有什么想法吗?

2 个答案:

答案 0 :(得分:3)

一旦你在按钮上设置了主题,就需要在其上调用“刷新”,如下所示......

$("#next").attr("data-theme","a").button('refresh');

如果你想将这种行为绑定到进程中的所有“下一步”按钮,并且它们可能不止一个,那么你可能想要考虑做更像这样的事情。它将检查每个页面上是否有一个具有colorChangeButton类的按钮,然后在单击时将主题更改为在data-theme-pressed的按钮属性上指定的备用主题。

<a href="#" data-role="button" class="colorChangeButton" data-theme-pressed="a" data-theme="b">Next</a>

<script type='text/javascript'>
    $('div').live('pageinit', function(){
        $("a.colorChangeButton).click(function(){
           var $thisButton = $(this);
           $thisButton.attr("data-theme",$thisButton.attr("data-theme-pressed")).button('refresh');
        });
    });
</script>

答案 1 :(得分:2)

function changeNextButtonColor() {
    $('#next').attr({'data-theme': 'a'});
}

如果您使用的是jQuery,那么这就是您的代码。