FIDDLE

Question

鉴于代码：

<html>
<head>
<script src="jquery-2.1.0.min.js"></script>
Something...
</head>

<button id='flip' type='button'>Flip</button>
<script>
$('#flip').bind('click', function() {
    var x = document.getElementById("flip").name;
    if (x == 'Flip')
    {
        $(this).text('Flop');
    }

    else
    {
        $(this).text('Flip');
    }

});

</script>

</body>
</html>

我每次点击都会尝试更改按钮，但它不起作用。

知道怎么解决吗？

非常感谢

Answer 1

name上没有<button>属性，因此您始终会获得空值。不需要document.getElementById，因为按钮位于this中。只需拨打不带参数的text()即可获得当前值：

var x = $(this).text();

更新

以下是JsFiddler中的演示。

Answer 2

我会做这样的事情：

<强> HTML：

<button id="flipflop">flip</button>

<强>的javascript：

var flip = true;
$("#flipflop").click(function(){
    if(flip)
        $("#flipflop").text("flop");
    else
        $("#flipflop").text("flip");
    flip = !flip;
})

FIDDLE

编辑：如果你想要真正精明，我会使用以下一行：

var flip = ($("#flipflop").text() === "flip");

自动确定你需要翻转哪种方式（或者是翻牌？）。

试图更改按钮的内容，每次点击都会失败

2 个答案:

更新

FIDDLE