php-resource



Zurück   PHP-Scripte PHP-Tutorials PHP-Jobs und vieles mehr > Entwicklung > HTML, JavaScript, AJAX, jQuery, CSS, Bootstrap, LESS
 

Login

 
eingeloggt bleiben
star Jetzt registrieren   star Passwort vergessen
 

 

 


HTML, JavaScript, AJAX, jQuery, CSS, Bootstrap, LESS Probleme mit HTML5, Bootstrap oder jQuery ?

Antwort
 
LinkBack Themen-Optionen Thema bewerten
  #1 (permalink)  
Alt 17-11-2008, 20:01
Dennis79
 Newbie
Links : Onlinestatus : Dennis79 ist offline
Registriert seit: Jul 2006
Beiträge: 73
Dennis79 ist zur Zeit noch ein unbeschriebenes Blatt
Standard [JavaScript] JQuery: bestimmtes Element erwischen

Hallo,

ich experimentiere jetzt seit ein paar Wochen mit JQuery.
Soweit gelingt mir auch alles, aber bei einer Sache stolper ich immer wieder und es vergeht einige Zeit des Ausprobierens ehe ich an's Ziel komme:

ich klicke etwas an und woanders soll was passieren (z.B. hide() oder show().

Kann mir das mal jemand erklären?
Ich versteh's nicht....

Ein Beispiel.
Ich hab eine Tabelle mit sagen wir 3 Zeilen und 5 Spalten.

In jeder vorletzten Spalte hab ich ein verlinktes Image.
Bei onclick wird eine Funktion aufgerufen, bei "success" der Funktion soll die entsprechende Zeile ausgeblendet werden.

Das kriege ich ohne "Hilfsmittel" einfach nicht gebacken.
Ich experimentiere mit prev(), next(), parent() und find() sowie diversen Kombinationen aus allem...

Nichts bringt mich zum Erfolg.
Letztlich habe ich es über die ID gelöst, d.h. jedes tr erhält als ID die ID des Datensatzes der in dieser zeile angezeigt wird.

So klappt's dann mit $("#MeineID").hide(); kinderleicht.
Aber die Lösung gefällt mir absolut nicht. Es ist auch eher ein "workaround".

Wäre echt spitze, wenn da mal jemand ein paar Beispiele parat hätte, die mich weiterbringen.

Viele Grüße,
Dennis

Edit: falls das nicht richtig rübergekommen ist: ich möchte per JQUery quasi ein belieibiges Element finden können, ohn dieses über die ID ansprechen zu müssen, denn ich will nicht für alle Tags ID's vergeben müssen...

Geändert von Dennis79 (17-11-2008 um 20:03 Uhr)
Mit Zitat antworten
  #2 (permalink)  
Alt 17-11-2008, 20:12
Benutzerbild von onemorenerd onemorenerd
  Moderator
Links : Onlinestatus : onemorenerd ist offline
Registriert seit: Mar 2005
Ort: Berlin
Beiträge: 9.471
onemorenerd wird schon bald berühmt werdenonemorenerd wird schon bald berühmt werden
Standard Re: [JavaScript] JQuery: bestimmtes Element erwischen

Zitat:
Original geschrieben von Dennis79
ich möchte per JQUery quasi ein belieibiges Element finden können, ohn dieses über die ID ansprechen zu müssen, denn ich will nicht für alle Tags ID's vergeben müssen...
Ja welches Element denn? JQuery muss das wissen, du mußt es ihm sagen. Also überlege dir, wie du das Element im DOM-Baum finden kannst. Das einfachste ist natürlich die ID, weil sie so schön einzigartig ist.
Weitere Möglichkeiten: http://docs.jquery.com/API/1.1.2/DOM...sing/Selectors
Mit Zitat antworten
  #3 (permalink)  
Alt 17-11-2008, 22:13
PHP-Desaster
 PHP Expert
Links : Onlinestatus : PHP-Desaster ist offline
Registriert seit: Mar 2006
Beiträge: 3.105
PHP-Desaster befindet sich auf einem aufstrebenden Ast
Standard

In Prototype könntest du mit up('tr') arbeiten. Da ich jetzt keine Ahnung von jQuery habe sieht mir auf dem ersten Blick parent( expr ) nach einer Methode mit der gleichen Funktionalität aus.
Mit Zitat antworten
  #4 (permalink)  
Alt 18-11-2008, 19:18
Dennis79
 Newbie
Links : Onlinestatus : Dennis79 ist offline
Registriert seit: Jul 2006
Beiträge: 73
Dennis79 ist zur Zeit noch ein unbeschriebenes Blatt
Standard

N'Abend,

@onemorenerd: Das ist genau mein Problem: wie sage ich JQuery, welches Element ich meine.

Hatte gehofft, dass mir das mal jemand so erklären kann, das ich es verstehe.

@PHP-Desaster: Damit hab ich es leider auch schon probiert.

Also ich habe parent(), next(), prev() und find() getestet, so wie z.B. auch next().next().next()....

Es klappt NICHTS. Ich kriege es auch nicht hin das nächste oder vorherige <tr> zu erwischen.
Also bei einer Verkettung von ausreichend parent() bzw prev() müsste ja die Zeile darüber mal irgendwann dabei sein...


Ich wäre so glücklich, wenn ich das kapieren würde.....

Hier mal ein (nicht funktionierendes) einfaches Beispiel:

PHP-Code:
<html>
<
head>
<
title>JQuery Tests</title>
<
script type="text/javascript" src="js/jquery126min.js"></script>          

 <script type="text/javascript">                                         
    
     $(document).ready(function() {
       
       
           $("a").click(function() {
            

                 alert('test');
                 $(this).prev("tr").hide();

           });
           

     
     });
                                     
 </script> 
</head>
<body>
    <table>
        <tr>
            <td>1</td>
            <td>Apfel</td>
            <td><b>5</b></td>
            <td><a href="#"><img src="bla.jpg" width="20px" height="20px"></a></td>
        </tr>
        <tr>
            <td>2</td>
            <td>Banane</td>
            <td><b>12</b></td>
            <td><a href="#"><img src="bla.jpg" width="20px" height="20px"></a></td>
        </tr>
        <tr>
            <td>3</td>
            <td>Kirsche</td>
            <td><b>2</b></td>
            <td><a href="#"><img src="bla.jpg" width="20px" height="20px"></a></td>
        </tr>
         <tr>
            <td>4</td>
            <td>Salat</td>
            <td><b>11</b></td>
            <td><a href="#"><img src="bla.jpg" width="20px" height="20px"></a></td>
        </tr>
    </table>
</body>
</html> 

Geändert von Dennis79 (18-11-2008 um 19:26 Uhr)
Mit Zitat antworten
  #5 (permalink)  
Alt 19-11-2008, 16:41
phpMorpheus2
 Registrierter Benutzer
Links : Onlinestatus : phpMorpheus2 ist offline
Registriert seit: Apr 2007
Beiträge: 646
Blog-Einträge: 2
phpMorpheus2 ist zur Zeit noch ein unbeschriebenes Blatt
Standard

Vll. so irgendwie?

PHP-Code:
<html>
<
head>
<
title>JQuery Tests</title>
<
script type="text/javascript" src="jquery.js"></script>          

 <script type="text/javascript">                                         
     $(document).ready(function() {
           $("a").click(function() {
                   $("#test1").hide("fast");

           });
     });                                
 </script> 
</head>
<body>
    <table>
        <tr>
            <td>1</td>
            <td>Apfel</td>
            <td><b>5</b></td>
            <td><a href="#"><img src="bla.jpg" width="20px" height="20px"></a></td>
        </tr>
        <tr>
            <td>2</td>
            <td>Banane</td>
            <td><b>12</b></td>
            <td><a href="#"><img src="bla.jpg" width="20px" height="20px"></a></td>
        </tr>
        <tr>
            <td>3</td>
            <td>Kirsche</td>
            <td><b>2</b></td>
            <td><a href="#"><img src="bla.jpg" width="20px" height="20px"></a></td>
        </tr>
         <tr>
            <td>4</td>
            <td>Salat</td>
            <td><b>11</b></td>
            <td><a href="#" id="test1"><img src="bla.jpg" width="20px" height="20px"></a></td>
        </tr>
    </table>
</body>
</html> 
Mit Zitat antworten
  #6 (permalink)  
Alt 19-11-2008, 18:46
Dennis79
 Newbie
Links : Onlinestatus : Dennis79 ist offline
Registriert seit: Jul 2006
Beiträge: 73
Dennis79 ist zur Zeit noch ein unbeschriebenes Blatt
Standard

Nein, d.h. ja: so klappt's natürlich.

Aber genau diesen Weg (das Verwenden von ID's) würde ich ja gerne vermeiden...
Mit Zitat antworten
  #7 (permalink)  
Alt 20-11-2008, 09:27
phpMorpheus2
 Registrierter Benutzer
Links : Onlinestatus : phpMorpheus2 ist offline
Registriert seit: Apr 2007
Beiträge: 646
Blog-Einträge: 2
phpMorpheus2 ist zur Zeit noch ein unbeschriebenes Blatt
Standard

Zitat:
Original geschrieben von Dennis79
Nein, d.h. ja: so klappt's natürlich.

Aber genau diesen Weg (das Verwenden von ID's) würde ich ja gerne vermeiden...
Du hast natürlich recht.
Sonst müsste man jeder neu erzeugen Zeile einer Tabelle eine individuelle ID zuweisen.
ALSO anders (so, wie du es wahrscheinlich haben möchtest

PHP-Code:
<html>
<
head>
<
title>JQuery Tests</title>
<
script type="text/javascript" src="jquery.js"></script>          

 <script type="text/javascript">                                         
     $(document).ready(function() {
           $("tr").click(function() {
                   $(this).hide("slow");

           });
     });                                
 </script> 
</head>
<body>
    <table>
        <tr>
            <td>1</td>
            <td>Apfel</td>
            <td><b>5</b></td>
            <td><a href="#"><img src="bla.jpg" width="20px" height="20px"></a></td>
        </tr>
        <tr>
            <td>2</td>
            <td>Banane</td>
            <td><b>12</b></td>
            <td><a href="#"><img src="bla.jpg" width="20px" height="20px"></a></td>
        </tr>
        <tr>
            <td>3</td>
            <td>Kirsche</td>
            <td><b>2</b></td>
            <td><a href="#"><img src="bla.jpg" width="20px" height="20px"></a></td>
        </tr>
         <tr>
            <td>4</td>
            <td>Salat</td>
            <td><b>11</b></td>
            <td><a href="#"><img src="bla.jpg" width="20px" height="20px"></a></td>
        </tr>
    </table>
</body>
</html> 
So wird IMMER der auf nächster Ebene vorhandene <tr> Tag ausgeblendet von anfand bist </tr> Ende !
Mit Zitat antworten
  #8 (permalink)  
Alt 20-11-2008, 10:33
phpMorpheus2
 Registrierter Benutzer
Links : Onlinestatus : phpMorpheus2 ist offline
Registriert seit: Apr 2007
Beiträge: 646
Blog-Einträge: 2
phpMorpheus2 ist zur Zeit noch ein unbeschriebenes Blatt
Standard

WOBEI !
Man merke:
Nun wird der JavaScript Code auch bei klick neben der Verlinkung in das <tr> Feld aktiviert.
Sprich, wenn du z.B. auf Kirsche klickst, verschwindet es.
Ich weiß gerade selber keine andere Möglichkeit, per klick auf einen Button in unterer Ebene ein bestimmtest, nicht explizit deklariertes Tag auf oberer ebene verschwinden zu lassen.
Hmm.
Mit Zitat antworten
  #9 (permalink)  
Alt 20-11-2008, 10:58
phpMorpheus2
 Registrierter Benutzer
Links : Onlinestatus : phpMorpheus2 ist offline
Registriert seit: Apr 2007
Beiträge: 646
Blog-Einträge: 2
phpMorpheus2 ist zur Zeit noch ein unbeschriebenes Blatt
Standard

Es gibt funktionen wie prev und next, jedoch finde ich keine z.B. "me" funktion.

Dann könnte man es nämlich so realisieren:
PHP-Code:
$(this).me("tr").hide("fast"
Dann würde nur der übergeordnere tr verschwinden, von anfang bist ende des <tr>-Tag's und somit auch der inhalt.
Jedoch gibt es kein "me" ...
Mit Zitat antworten
  #10 (permalink)  
Alt 20-11-2008, 11:27
phpMorpheus2
 Registrierter Benutzer
Links : Onlinestatus : phpMorpheus2 ist offline
Registriert seit: Apr 2007
Beiträge: 646
Blog-Einträge: 2
phpMorpheus2 ist zur Zeit noch ein unbeschriebenes Blatt
Standard

Habe es auch schon mit der parents-Funktion versucht, klappt leider auch nicht nur den übergeordneten bzw. mich einschließenden <tr>-Tag anzusprechen:

PHP-Code:
$(this).parent("tr").hide("fast"); 
Mit Zitat antworten
  #11 (permalink)  
Alt 20-11-2008, 11:29
PHP-Desaster
 PHP Expert
Links : Onlinestatus : PHP-Desaster ist offline
Registriert seit: Mar 2006
Beiträge: 3.105
PHP-Desaster befindet sich auf einem aufstrebenden Ast
Standard

Ich weiß gar nicht, wo das Problem ist. Mit parentNode kommst du doch an den Elternknoten. Nur weil jQuery das nicht hergibt bzw. es keiner findet, darf trotzdem auf natives JS zurückgegriffen werden.

@phpMorpheus2: Ließ doch mal das ganze Thema, bevor du antwortest!
Mit Zitat antworten
  #12 (permalink)  
Alt 20-11-2008, 11:37
phpMorpheus2
 Registrierter Benutzer
Links : Onlinestatus : phpMorpheus2 ist offline
Registriert seit: Apr 2007
Beiträge: 646
Blog-Einträge: 2
phpMorpheus2 ist zur Zeit noch ein unbeschriebenes Blatt
Standard

Zitat:
Original geschrieben von PHP-Desaster
Ich weiß gar nicht, wo das Problem ist. Mit parentNode kommst du doch an den Elternknoten. Nur weil jQuery das nicht hergibt bzw. es keiner findet, darf trotzdem auf natives JS zurückgegriffen werden.

@phpMorpheus2: Ließ doch mal das ganze Thema, bevor du antwortest!
Danke für die Funktion.
Er wollte es in jQuery. Also!
Mit Zitat antworten
  #13 (permalink)  
Alt 20-11-2008, 12:20
phpMorpheus2
 Registrierter Benutzer
Links : Onlinestatus : phpMorpheus2 ist offline
Registriert seit: Apr 2007
Beiträge: 646
Blog-Einträge: 2
phpMorpheus2 ist zur Zeit noch ein unbeschriebenes Blatt
Standard

Kannst du denn anhand seines Beispieles via parentNode ein Beispiel geben wie er immer die aktuelle <tr> reihe hide'n kann?

PHP-Code:
<body>
    <
table>
        <
tr>
            <
td>1</td>
            <
td>Apfel</td>
            <
td><b>5</b></td>
            <
td><a href="#"><img src="bla.jpg" width="20px" height="20px"></a></td>
        </
tr>
        <
tr>
            <
td>2</td>
            <
td>Banane</td>
            <
td><b>12</b></td>
            <
td><a href="#"><img src="bla.jpg" width="20px" height="20px"></a></td>
        </
tr>
        <
tr>
            <
td>3</td>
            <
td>Kirsche</td>
            <
td><b>2</b></td>
            <
td><a href="#"><img src="bla.jpg" width="20px" height="20px"></a></td>
        </
tr>
         <
tr>
            <
td>4</td>
            <
td>Salat</td>
            <
td><b>11</b></td>
            <
td><a href="#"><img src="bla.jpg" width="20px" height="20px"></a></td>
        </
tr>
    </
table>
</
body
Mit Zitat antworten
  #14 (permalink)  
Alt 20-11-2008, 12:32
PHP-Desaster
 PHP Expert
Links : Onlinestatus : PHP-Desaster ist offline
Registriert seit: Mar 2006
Beiträge: 3.105
PHP-Desaster befindet sich auf einem aufstrebenden Ast
Standard

Wenn du innerhalb der tr bist, ist's ja nicht schwer:
PHP-Code:
var parent=this;
var 
found=null;
while(
parent) {
    if(
parent.nodeName.toLowerCase()=='tr') {
        
found=parent;
        break;
    }
    
parent=parent.parentNode;
}

// found ist jetzt das tr oder null, wenn es kein tr-Elternelement gibt 
Ungetestet
Mit Zitat antworten
  #15 (permalink)  
Alt 20-11-2008, 20:55
Dennis79
 Newbie
Links : Onlinestatus : Dennis79 ist offline
Registriert seit: Jul 2006
Beiträge: 73
Dennis79 ist zur Zeit noch ein unbeschriebenes Blatt
Standard

N'Abend,

ich hab die Lösung in JQuery dann auch selber gefunden.

D.h. eigentlich hat mir PHP-Desaster den Schlauch auf dem ich stand unter den Füßen weggezogen.
Danke dafür :-)

Der JQuery-Code für mein Beispiel ist folgender:

PHP-Code:
           $("a").click(function() {
                $(
this).parent().parent().hide();
           }); 
Wobei ich beim zweiten parent() sicherheitshalber noch ein "tr" übergeben werde...
Mit Zitat antworten
Antwort

Lesezeichen


Aktive Benutzer in diesem Thema: 1 (Registrierte Benutzer: 0, Gäste: 1)
 

Themen-Optionen
Thema bewerten
Thema bewerten:

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are an


PHP News

ebiz-trader 7.5.0 mit PHP7 Unterstützung veröffentlicht
ebiz-trader 7.5.0 mit PHP7 Unterstützung veröffentlichtDie bekannte Marktplatzsoftware ebiz-trader ist in der Version 7.5.0 veröffentlicht worden.

28.05.2018 | Berni

Wissensbestand in Unternehmen
Wissensbestand in UnternehmenLebenslanges Lernen und Weiterbilden sichert Wissensbestand in Unternehmen

25.05.2018 | Berni


 

Aktuelle PHP Scripte

PHP Server Monitor

PHP Server Monitor ist ein Skript, das prüft, ob Ihre Websites und Server betriebsbereit sind.

11.09.2018 Berni | Kategorie: PHP/ Security
PHP WEB STATISTIK ansehen PHP WEB STATISTIK

Die PHP Web Statistik bietet Ihnen ein einfach zu konfigurierendes Script zur Aufzeichnung und grafischen und textuellen Auswertung der Besuchern Ihrer Webseite. Folgende zeitlichen Module sind verfügbar: Jahr, Monat, Tag, Wochentag, Stunde Folgende son

28.08.2018 phpwebstat | Kategorie: PHP/ Counter
Affilinator - Affilinet XML Produktlisten Skript

Die Affilinator Affilinet XML Edition ist ein vollautomatisches Skript zum einlesen und darstellen der Affili.net (Partnerprogramm Netzwerk) Produktlisten und Produktdaten. Im Grunde gibt der Webmaster seine Affilinet PartnerID ein und hat dann unmittelb

27.08.2018 freefrank@ | Kategorie: PHP/ Partnerprogramme
 Alle PHP Scripte anzeigen

Alle Zeitangaben in WEZ +2. Es ist jetzt 23:20 Uhr.