I problemi non girevoli testo del link con JQ

Question

Io cerco di utilizzare questo codice per alternare testo sul link:

var showText="<span>Open</span> &darr;";
var hideText="<span>Close</span> &uarr;";
$('h1').before('<a href="javascript:;" id="hc_toggle_close">' + showText + '</a>');
$('#hc_toggle_close').click(function () {
    $('#hc_toggle_close:contains("Open")').html(hideText);
    $('#hc_toggle_close:contains("Close")').html(showText);
});

Ma non funziona! Così come un normale if ... else costruzione. Qualcuno potrebbe per favore mi punto che cosa c'è che non va qui. Grazie!

Answer 1

Utilizzare la funzione di supporto toggle:

var showText="<span>Open</span> &darr;";
var hideText="<span>Close</span> &uarr;";
$('h1').before('<a href="javascript:;" id="hc_toggle_close">' + showText + '</a>');
$('#hc_toggle_close').toggle(
  function () {
    $('#hc_toggle_close').html(hideText);
  },
  function () {
    $('#hc_toggle_close').html(showText);
  }
);

Dalla documentazione di <=>:

  

Ogni volta che un elemento abbinato viene cliccato,   la prima funzione specificata viene licenziato,   quando si fa clic di nuovo, il secondo è   licenziato. Tutti gli scatti successivi continuano   per ruotare attraverso le due funzioni.