2009-02-25 18 views
5

Tengo el siguiente código que realiza una función similar a la forma en que funciona el enlace comentario aquí en Stackoverflow ... cuando se hace clic se desencadena una ActionResult y rellena un divenlaces Desactivación con jQuery

$(function() { 
     $("a[id ^='doneLink-']").live('click', function(event) { 
      match = this.id.match(/doneLink-(\d+)/); 
      container = $("div#doneContainer-" + match[1]) 
      container.toggle(); 

      if (container.is(":visible")) { 
       container.load($(this).attr("href")); 
      } else { 
       container.html("Loading..."); 
      } 
      event.preventDefault(); 
     }); 
    }); 

Quiero ser capaz de hacer una cosa, cambiar el texto del enlace del cual hicieron clic para decir algo como "Ocultar" y también deshabilitar otros enlaces en el pequeño menú donde reside este enlace.

Editar: La fuente para ir con esta función se parece a esto

<div id="dc_lifelistmenu"style="float:left;padding-bottom:5px;font-size:10pt;width:400px;"> 
    <a href="/entries/addentry/86">Add Entry</a> | 
    <a href="/goals/adddaimoku/86" id="daimokuLink-2">Log Daimoku</a> | 
    <a href="/goals/done/86" id="doneLink-2">Mark Completed</a> | 
    <a href="/goals/remove/86">Remove</a> 
</div><br /> 
<div id='daimokuContainer-2' style="display:none;"> Loading...</div> 
<div id='doneContainer-2' style="display:none;"> Loading...</div> 
+0

nice question .......... –

Respuesta

4

Para modificar el texto del enlace dentro de su función, basta con utilizar:

this.text('New Text!'); 

Para desactivar otro texto, Tendríamos que ver el origen de la página. No estoy seguro de lo que entendemos por "otros enlaces" ...

ACTUALIZACIÓN: Gracias a tu comentario, entonces supongo que lo que quiere:

$(function() { 
     $("a[id ^='doneLink-']").live('click', function(event) { 
      match = this.id.match(/doneLink-(\d+)/); 
      container = $("div#doneContainer-" + match[1]) 
      container.toggle(); 

      if (container.is(":visible")) { 
       container.load($(this).attr("href")); 
      } else { 
       container.html("Loading..."); 
      } 
      event.preventDefault(); 
      // added 
      this.text('Hide'); 
      // disable others manually, repeat and adjust for each link 
      $("#daimokuLink-" + match[1]).toggle(); 
      // or in one shot, all but the one I clicked 
      $("#dc_lifelistmenu:not(#doneContainer-" + match[1] + ")").toggle(); 
     }); 
    }); 

ACTUALIZACIÓN 2: Vi su comentario. Para deshabilitar un enlace en lugar de ocultarlo, deshabilite el onclick anulándolo, en lugar de usar toggle().

$("#daimokuLink-" + match[1]).click(function() { return false; }); 
+0

$ (this) .text ('¡Nuevo texto!'); por supuesto;) – ybo

+0

Sí, esto funcionó ahora, para desactivar no ocultar los otros enlaces ... solo quiere que no se pueda hacer clic en ellos. – dswatik

+0

Gracias, funcionó a la perfección. – dswatik

3

Hay algunas maneras de abordar esto, probablemente, lo más fácil es simplemente hacer algo como: $ ('A') filtrar ('No: #doneLink') ocultar();.. para ocultar todos los enlaces que no son el que ha especificado anteriormente.

Consulte esta página para más información sobre los selectores de jQuery:

http://docs.jquery.com/Selectors

9

Si desea eliminar el enlace en lugar de desactivarlo:

jQuery('#path .to .your a').each(function(){ 
    var $t = jQuery(this); 
    $t.after($t.text()); 
    $t.remove(); 
}); 

Notas:

  • También puede usar la función (k, v) para tomar un iterador nd el elemento sin utilizar 'esto'
  • Siéntase libre para sustituir jQuery con $ si está utilizando el espacio de nombres predeterminado
  • var $ t = jQuery (esto) es una función de almacenamiento en caché que hace referencia al elemento y también ayuda a limpiar el código
  • es una buena práctica para preceder a las variables que en realidad son elementos jQuery con un $ para ayudar a mantenerlos separados visualmente en el código. También lo ayuda a reconocer que puede invocar métodos sobre ellos.
  • 1

    La forma más sencilla de deshabilitar el anclaje es el uso de atributos deshabilitados, pero el problema es que el atributo dado solo es compatible con IE. No funcionará en Firefox, por ejemplo. Si desea que su código funcione en diferentes navegadores, puede intentar guardar los valores de los atributos href y onclick en otros atributos personalizados, luego establecer href="#" y onclick="return false;". Al habilitar de nuevo, debe restaurar los valores guardados de href y onclick. Para efectos visuales puedes usar aplicar specila css-class.Describí este enfoque en mi blog: Disable hyperlink

    Cuestiones relacionadas