当按钮被点击时,我希望您能更改它。一开始只有一个“编辑”按钮。点击后,它将变成一个“保存”按钮,并且我还想在其旁边显示一个“取消”按钮。
我该怎么做?我有下面的代码:
<!DOCTYPE html>
<html>
<head>
<script class="jsbin" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<meta charset=utf-8 />
<title>demo by roXon</title>
<!--[if IE]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>
<body>
<button data-text="Save">Edit</button>
<p>Hello</p>
<p style="display: none">Good Bye</p>
<script>
$("button").click(function(){
$(this).nextUntil('button').toggle();
var btnText = $(this).text();
$(this).text( $(this).data('text') );
$(this).data('text', btnText );
});
</script>
</body>
</html>