Question

我有一个非常基本的切换脚本，工作正常，但我想切换标签，使其显示先显示然后隐藏

我的HTML是：

    <button type="button" class="show">Show</button>
<br />
<br />
<div id="info">#info</div>
<div id="edit">#edit</div>

我的jquery是

$("#edit").hide();
$(".show").click(function(){
$("#info, #edit").fadeToggle("slow");
});

css是：

#info {
 position:absolute;
 left:0px;
 background-color:green;
 width:100px;
 height:100px;   
}

#edit {
 position:absolute;
 background-color:red;
 width:100px;
 height:100px;  
}

Answer 1

添加以下行：

$('button').text($('button').text() === 'Show' ? "Hide" : "Show");

所以你的JavaScript看起来像这样：

$("#edit").hide(); 
$("show").click(function(){
    $("#info, #edit").fadeToggle("slow");
    $('button').text($('button').text() === 'Show' ? "Hide" : "Show");
});

该行根据当前值切换按钮文本。

此外，您的彩色框在切换时移动了一点，因为left:0仅在一个DIV上。

jsFiddle：https://jsfiddle.net/xerbefmg/

Jquery切换标签/按钮文本

1 个答案: