1

我想知道，为什么点击按钮后样式被破坏，如截图所示？而且文本也不会改变，只有在第二次点击之后。

这是屏幕截图： 在敲击之前 敲击后 这是我的代码：

<!DOCTYPE HTML>
<html>
<head>
<link rel="stylesheet" href="css/jquery.mobile-1.1.0.min.css" />
<script type="text/javascript" src="js/cordova-1.8.1.js"></script>
<script type="text/javascript" src="js/jquery-1.6.4.min.js"></script>
<script type="text/javascript" src="js/jquery.mobile-1.1.0.min.js"></script>
<style>
#pause
{
color:black;
font-size: 40px;    

}
</style>
<script>
$('#pause').live('tap', function(event){

    if ($('#pause').text() == "Start")
    {
        $('#pause').text("Pause");
    }

    else
    {
        $('#pause').text("Start");
    }


});
</script>
</head>
<body >
<div data-role="page" data-theme="c">
<div data-role="button"  id="pause"> Start </div>
</div>
</body>
</html>
4

1 回答 1

2

因为，您直接在按钮 ID 上应用 text() 方法。如果您检查元素，您将看到 jquery-mobile 在您的按钮 div 中添加子元素。

尝试这个：

$('#pause .ui-btn-text').text("Pause");

现场演示：http:
//jsfiddle.net/nachiket/ww7Sc/

于 2012-06-29T17:57:15.780 回答