Delphi-PRAXiS - problem mit jquery

Delphi-PRAXiS (https://www.delphipraxis.net/forum.php)

- Programmieren allgemein (https://www.delphipraxis.net/40-programmieren-allgemein/)

- - problem mit jquery (https://www.delphipraxis.net/171958-problem-mit-jquery.html)

problem mit jquery

Kann mir einer sagen warum ich immer ein undefined zurück kriege

Code:

			<html>

<head>

<title>KAS Server</title>

<meta name="viewport" content="width=device-width, initial-scale=1">

<link rel="stylesheet" href="/jquery.mobile/jquery.mobile-1.2.0.css" />

<script src="/jquery.mobile/jquery-1.8.2.js"></script>

<script src="/jquery.mobile/jquery.mobile-1.2.0.js"></script>

</head><body><div data-role="page" class="type-interior">

<div data-role="header" data-theme="f">

<h1>KAS</h1>

<h1>Eingeloggt als : Flathmann Wilfried</h1>

</div><!-- /header -->

<script type="text/javascript">

$("#menu").click(function(){$('#daten').load($this.attr("href"));});

$("#liste").click(function(){$('#daten').load($this.attr("href"));});

</script>

<div data-role="content"><div class="content-primary">

<div id="daten">

<div id="menu">

<ul data-role="controlgroup" data-type="horizontal" class="localnav">

<a href="index.html" data-role="button" data-ajax="false">Hauptmenu</a>

<a href="zeiterfassung.html?mode=menu&id=1" data-role="button" class="menu" >Kommt</a>

<a href="zeiterfassung.html?mode=menu&id=2" data-role="button" class="ui-disabled" >Geht</a>

</ul>

</div>

Drücken Sie kommt<br></div><!--/content-primary --></div><!-- /content --></div>

</div></body></html>

Wenn ich den link klicke krige ich daten zurück aber der Browser sagt immer undefined warum ?

AW: problem mit jquery

Weil sich

Code:

$this

in dem Kontext auf

Code:

div#menu

bezieht und dort kein href-Attribut vorhanden ist.

AW: problem mit jquery

Das scheint es nicht zu sein denn das geht auch nicht

Code:

			<div data-role="content"><div class="content-primary">

<div id="daten">

<ul data-role="controlgroup" data-type="horizontal" class="localnav">

<a href="index.html" data-role="button" data-ajax="false">Hauptmenu</a>

<a href="zeiterfassung.html?mode=menu&id=1" data-role="button" id="menu" class="menu" >Kommt</a>

<a href="zeiterfassung.html?mode=menu&id=2" data-role="button" id="menu" class="ui-disabled" >Geht</a>

</ul>

AW: problem mit jquery

Funktioniert denn das click()-Event überhaupt? Mal ein alert() reingeschrieben?

Eigentlich solltest du die Installation der Eventhandler in eine

.ready()-Methode packen, vielleicht liegt's auch daran.

Edit:// Dein Code ist irgendwie generell komisch. Von der Formatierung abgesehen hast du da ein ul ohne lis drin, was schon irgendwie komisch ist. Ich weiß auch nicht so recht was du da bezwecken willst. Warum soll beim Klick auf das gesamte div der Inhalt per Ajax von einem nicht weiter spezifizierten href-Attribut geladen und überschrieben werden? Meinst du das ganze eventuell eher so:

HTML-Code:

			<html>

   <head>

      <title>KAS Server</title>

      <meta name="viewport" content="width=device-width, initial-scale=1">

      <link rel="stylesheet" href="/jquery.mobile/jquery.mobile-1.2.0.css" />

      <script src="jquery-1.8.2.js"></script>

      <script src="jquery.mobile-1.2.0.js"></script>

      <script type="text/javascript">

         $(document).ready(function(){

            $("#menu a").click(function(){

               $('#daten').load($(this).attr("href"));

            });

         });

      </script>

   </head>

   <body>

      <div data-role="page" class="type-interior">

         <div data-role="header" data-theme="f">

            <h1>KAS</h1>

            <h1>Eingeloggt als : Flathmann Wilfried</h1>

         </div>

         <!-- /header -->

         <div data-role="content">

            <div class="content-primary">

               <div id="daten">

                  <div id="menu" style="border:1px solid red;">

                     <ul data-role="controlgroup" data-type="horizontal" class="localnav">

                        <a href="index.html" data-role="button" data-ajax="false">Hauptmenu</a>

                        <a href="zeiterfassung.html?mode=menu&id=1" data-role="button" class="menu" >Kommt</a>

                        <a href="zeiterfassung.html?mode=menu&id=2" data-role="button" class="ui-disabled" >Geht</a>

                     </ul>

                  </div>

                  Drücken Sie kommt<br>

               </div>

               <!--/content-primary -->

            </div>

            <!-- /content -->

         </div>

      </div>

   </body>

</html>

Liebe Grüße,
Valentin

AW: problem mit jquery

Du solltest dir erst einmal anschauen wie HTML-Listen aufgebaut sind, bevor mit Javascript rumspielst:

http://de.selfhtml.org/html/text/listen.htm

Ich würde auch empfehlen zukünftig jsfiddle.net zu nutzen, damit man dein Problem direkt nachvollziehen kann, auch wenn es einem hier ins Auge springt.

@Valle
Du hast zwar jetzt den Selector richtig angepasst, jedoch sollte ohne "return false" er nicht nur das div austauschen, sondern auch die Seite neu laden, schließlich klickt er auf einen Link und ich glaube nicht das dies so gewollt wird. :wink: