Mr. T-Rom: jQuery: href folgen falls Javascript nicht aktiviert!

Hallo Leute.
Ich spiele in letzter Zeit mit jQuery rum
und komme gerade nicht auf einen mir wichtigen Nenner.

Ich möchte Javascript für meine Webseiten noch nicht
voraussetzen, daher soll, falls ein Nutzer kein Js aktiviert hat,
einem Link gefolgt werden.

Das klappte bisher ja so recht schön:

  
<a href="#delete" onclick="hide(this);return false;" alt="delete" />Delete</a>  

Funktioniert aber leider nicht mehr mit jQuery bzw.
hab ich es bisher nicht hinbekommen.
Hab verschiedene Varianten versucht...

Die Letzte ist:

  
<script type="text/javascript">		  
	  
		$(document).ready(function(){  
			function hide(object){  
				object.style.color = "#983423";  
		    	object.parents(".pane").animate({ opacity: "hide" }, "slow");  
			};  
		});  
  
</script>  
  
<div class="pane">  
	...  
	<a href="#delete" onclick="hide(this);return false;" alt="delete" />Delete</a>  
</div>  

object.style.color funktioniert prima, jedoch nicht mehr die jQuery Funktionen.

Natürlich sind andere Varianten bei mir gerne gesehen, solange:

  • Javascript nicht vorausgesetzt wird
  • Falls kein Js, einem Link gefolgt wird
  • Bei Js, keinem Link gefolgt wird

Hoffe auf eure Hilfe.
Danke!

  1. Hallo,

    Die Letzte ist:

    <script type="text/javascript">

      $(document).ready(function(){  
      	function hide(object){  
      		object.style.color = "#983423";  
          	object.parents(".pane").animate({ opacity: "hide" }, "slow");  
      	};  
      });  
    

    </script>

    Warum willst Du eine Funktion erst definieren wenn das Dokument fertig geladen ist?
    [code lang=javascript]
    function hide(object){
     //So wie Du es übergibst, ist object hier ein DOM-Objekt, kein JQuery-Objekt.
     object.style.color = "#983423";
     // also müssen wir erst ein JQuery-Objekt draus machen
     $(object).parents(".pane").animate({ opacity: "hide" }, "slow");
    }

    ~~~html
      
    
    > <div class="pane">  
    > 	...  
    > 	<a href="#delete" onclick="hide(this);return false;" alt="delete" />Delete</a>  
    > </div>  
    
    

    Allerdings solltest Du, wenn Du schon JQuery benutzt, auch grundsätzlich auf Javascript im HTML verzichten und konsequent die JQuery-Methoden benutzen.

      
    $(document).ready(function(){  
     $(".pane > a").click(function() {  
      this.style.color = "#983423";  
      $(this).parents(".pane").animate({ opacity: "hide" }, "slow");  
      return false;  
     });  
    });  
    
    
      
    <div class="pane">  
            ...  
            <a href="#delete" alt="delete" />Delete</a>  
    </div>  
    
    

    viele Grüße

    Axel

    1. Hallo,

      <div class="pane">
              ...
              <a href="#delete" alt="delete" />Delete</a>

      ^
      Den Fehler im HTML hatte ich übersehen----|

      </div>

        
      ~~~html
        
      <div class="pane">  
               ...  
               <a href="#delete" alt="delete">Delete</a>  
      </div>  
      
      

      viele Grüße

      Axel

      1. Auch wenn das Problem schon gelöst scheint, schlage ich trotzdem folgendes vor:

        $(document).ready(function(){  
            $('.pane > a').hide();  
        });
        
    2. Allerdings solltest Du, wenn Du schon JQuery benutzt, auch grundsätzlich auf Javascript im HTML verzichten und konsequent die JQuery-Methoden benutzen.

      $(document).ready(function(){
      $(".pane > a").click(function() {
        this.style.color = "#983423";

      das gebe ich weiter - wenn man schon jQuery nutzt, sollte man auch grundsätzlich dessen Methoden verwenden.

      this.css('color', '#983423'); bzw. $(this).css('color', '#983423');