HTML添加和取消按钮怎么打,将元素添加到状态更改按钮Html

我不会空着。相反，您的按钮类中有两个DIV，并使用onclick和模糊事件，根据按钮的活动状态切换其可见性。由于你正在使用jQuery，你可以使用children()来定位按钮中的类(如果你在一个页面上有多个，它就不会触发所有这些类。)

HTML：

Recipe name

By: Author

Recipe Details

CSS：

我只添加了一个类，默认显示详细信息：none。

.details {

display: none;

}

使用Javascript：

$(document).ready(function () {

$('.button').click( function() {

$('html,body').animate({ scrollTop: $(this).offset().top - ( ($(window).height()/1.5) - $(this).outerHeight(true) ) / 2 }, 2000);

//$(this).empty(); //empty title and author to prepare for recipe.

//$(this).append("Recipe Instructions Below");

$(this).children('.title').hide();

$(this).children('.details').show();

});

$('.button').blur(function() {

$(this).children('.details').hide();

$(this).children('.title').show();

});

});