基本上我有以下JS,但想知道如何更有效地执行它,我似乎使事情复杂化了。我觉得我可以重用这些功能之一;
$('.hide').hide(); //hides all the hide links on page load
$('a.show').each(function() { //running iterator function
var thisLink = $(this);
$(this).click(function() { // Checks if any show link is clicked
show(thisLink) // Calling the show function & passing the selector value
});
});
$('a.hide').each(function() { //running iterator function
var thisLink = $(this);
$(this).click(function() { // Checks if any hide link is clicked
hide(thisLink) // Calling the hide function & passing the selector value
});
});
});
function show(btn) {
btn.hide(); //hides the element where click was received
btn.next().show(); //displays the next element that in our case is hide link
btn.next().next().slideToggle('slow'); //toggles the next of next element that is details div
}
function hide(btn) {
btn.hide(); //hides the element where click was received
btn.prev().show(); //displays the previous element that in our case is show link
btn.next().slideToggle('slow'); //again toggles the next element that is details div to hide it
}
最佳答案
尝试,
$('.hide').hide(); //hides all the hide links on page load
$('a.show').click(show);
$('a.hide').click(hide);
function show() {
$(this).hide().next().show().next().slideToggle('slow');
}
function hide() {
$(this).hide().prev().show();
$(this).next().slideToggle('slow');
}
关于javascript - 具有HTML文本更改的多个SlideToggle Divs,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/24202097/