具有HTML文本更改的多个SlideToggle

具有HTML文本更改的多个SlideToggle

基本上我有以下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/

10-13 02:53