Keyup Event Syntax Verständnisproblem – SELFHTML-Forum Forum als Ergänzung zum SELFHTML-Wiki und zur Dokumentation SELFHTML https://forum.selfhtml.org/self Keyup Event Syntax Verständnisproblem Thu, 27 Jul 17 14:35:15 Z https://forum.selfhtml.org/self/2017/jul/27/keyup-event-syntax-verstaendnisproblem/1700213#m1700213 https://forum.selfhtml.org/self/2017/jul/27/keyup-event-syntax-verstaendnisproblem/1700213#m1700213 <p>Hallo,</p> <p>ich habe einen Javascript Code für eine Textbox geschrieben. Es geht eigentlich um Autovervollständigung - Es soll eine Dropdownliste mit Suchergebnissen angezeigt werden. Dazu wird ein AJAX POST an den Server gesendet, wo ein C# Controller die Ergebnisliste zurückliefern soll. Leider wird die Funktion im Controller aber nicht aufgerufen. Ich vermute, das Keyup Event wird nicht ausgelöst.</p> <p>In den Beispielen die ich gefunden habe, gibt es unterschiedliche Herangehensweisen ein Keyup Event an eine Textbox zu koppeln.</p> <p>In meinem Code funktionieren diese aber nicht und ich verstehe nicht wieso. Es sind JQuery Erweiterungen und ich hab meine Schwierigkeiten dahinter zu steigen, wann das funktioniert.</p> <p>In meinem Fall funktioniert keins von beiden. Es wäre schön wenn mich jemand aufklären könnte. Ich bin für jeden Tip dankbar.</p> <p>lg</p> <p>apfelsine</p> <pre><code class="block language-javascript"> <span class="token function">$</span><span class="token punctuation">(</span>document<span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">ready</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token comment">//Version 1</span> <span class="token function">$</span><span class="token punctuation">(</span><span class="token string">"#SelectedStationStart"</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">on</span><span class="token punctuation">(</span><span class="token string">"keyup"</span><span class="token punctuation">,</span> <span class="token keyword">function</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">{</span> <span class="token comment">//... some code</span> <span class="token punctuation">}</span> <span class="token comment">//Version 2 </span> <span class="token function">$</span><span class="token punctuation">(</span><span class="token string">"#SelectedStationStart"</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">keyup</span><span class="token punctuation">(</span><span class="token keyword">function</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token comment">//...</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span> </code></pre> <p>Mein Code sieht so aus:</p> <pre><code class="block language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>body</span><span class="token punctuation">></span></span> <span class="token comment"><!--...some code… --></span> <span class="token comment"><!--Javascript hier (siehe unten)--></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>div</span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>targetDiv<span class="token punctuation">"</span></span><span class="token punctuation">></span></span><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>input</span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>text<span class="token punctuation">"</span></span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>SelectedStationStart<span class="token punctuation">"</span></span> <span class="token punctuation">/></span></span><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>input</span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>hidden<span class="token punctuation">"</span></span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>StartId<span class="token punctuation">"</span></span> <span class="token punctuation">/></span></span><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>div</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>body</span><span class="token punctuation">></span></span> </code></pre> <pre><code class="block language-javascript"> <span class="token operator"><</span>script type<span class="token operator">=</span><span class="token string">"text/javascript"</span><span class="token operator">></span> <span class="token function">$</span><span class="token punctuation">(</span>document<span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">ready</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token function">$</span><span class="token punctuation">(</span><span class="token string">"#SelectedStationStart"</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">on</span><span class="token punctuation">(</span><span class="token string">"keyup"</span><span class="token punctuation">,</span> <span class="token keyword">function</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">{</span> <span class="token comment">//$("#SelectedStationStart").keyup(function () {</span> <span class="token comment">//get value from input textbox</span> <span class="token keyword">var</span> query <span class="token operator">=</span> <span class="token function">$</span><span class="token punctuation">(</span><span class="token keyword">this</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">val</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">//fetch values for searchterm</span> <span class="token function">getItems</span><span class="token punctuation">(</span>query<span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token keyword">function</span> <span class="token function">getItems</span><span class="token punctuation">(</span><span class="token parameter">query</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token comment">//handle search from inputfield</span> <span class="token keyword">var</span> postData <span class="token operator">=</span> <span class="token punctuation">{</span> <span class="token literal-property property">searchvalue</span><span class="token operator">:</span> request<span class="token punctuation">.</span>term <span class="token punctuation">}</span><span class="token punctuation">;</span> <span class="token function">addAntiForgeryToken</span><span class="token punctuation">(</span>postData<span class="token punctuation">)</span><span class="token punctuation">;</span> $<span class="token punctuation">.</span><span class="token function">ajax</span><span class="token punctuation">(</span><span class="token punctuation">{</span> <span class="token literal-property property">cache</span><span class="token operator">:</span> <span class="token boolean">false</span><span class="token punctuation">,</span> <span class="token literal-property property">type</span><span class="token operator">:</span> <span class="token string">'POST'</span><span class="token punctuation">,</span> <span class="token literal-property property">url</span><span class="token operator">:</span> <span class="token string">'@Url.Action("SelectStation", "TicketSystem")'</span><span class="token punctuation">,</span> <span class="token literal-property property">data</span><span class="token operator">:</span> postData<span class="token punctuation">,</span> <span class="token literal-property property">dataType</span><span class="token operator">:</span> <span class="token string">'json'</span><span class="token punctuation">,</span> <span class="token function-variable function">success</span><span class="token operator">:</span> <span class="token keyword">function</span> <span class="token punctuation">(</span><span class="token parameter">response</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token keyword">if</span> <span class="token punctuation">(</span>response<span class="token punctuation">.</span>Data <span class="token operator">!=</span> <span class="token keyword">null</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token keyword">if</span> <span class="token punctuation">(</span><span class="token function">$</span><span class="token punctuation">(</span><span class="token string">"#targetDiv"</span><span class="token punctuation">)</span> <span class="token operator">!=</span> <span class="token keyword">undefined</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token function">$</span><span class="token punctuation">(</span><span class="token string">"#targetDiv"</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">remove</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span> data <span class="token operator">=</span> response<span class="token punctuation">.</span>Data<span class="token punctuation">;</span> <span class="token comment">//append data to div</span> <span class="token function">$</span><span class="token punctuation">(</span><span class="token string">"#targetdiv"</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">append</span><span class="token punctuation">(</span><span class="token function">$</span><span class="token punctuation">(</span><span class="token string">"<ul id='targetUI'></ul>"</span><span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">//removing previously added li</span> <span class="token function">$</span><span class="token punctuation">(</span><span class="token string">"#targetdiv"</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">find</span><span class="token punctuation">(</span><span class="token string">"li"</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">remove</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">//iterate trough list and </span> $<span class="token punctuation">.</span><span class="token function">each</span><span class="token punctuation">(</span>data<span class="token punctuation">,</span> <span class="token keyword">function</span> <span class="token punctuation">(</span><span class="token parameter">i<span class="token punctuation">,</span> value</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token comment">//stringvalue should be: id;stationname</span> item <span class="token operator">=</span> value<span class="token punctuation">.</span><span class="token function">split</span><span class="token punctuation">(</span><span class="token string">";"</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">//on click call method</span> <span class="token function">$</span><span class="token punctuation">(</span><span class="token string">"#targetUI"</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">append</span><span class="token punctuation">(</span><span class="token function">$</span><span class="token punctuation">(</span><span class="token string">"<li id='' onclick='javascript:setStartStation("</span> <span class="token operator">+</span> item<span class="token punctuation">[</span><span class="token number">0</span><span class="token punctuation">]</span> <span class="token operator">+</span> <span class="token string">",this)'>"</span> <span class="token operator">+</span> item<span class="token punctuation">[</span><span class="token number">1</span><span class="token punctuation">]</span> <span class="token operator">+</span> <span class="token string">"</li>"</span><span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token keyword">else</span> <span class="token punctuation">{</span> <span class="token comment">//if data is null remove all items</span> <span class="token function">$</span><span class="token punctuation">(</span><span class="token string">"#targetUI"</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">find</span><span class="token punctuation">(</span><span class="token string">"li"</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">remove</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token function">$</span><span class="token punctuation">(</span><span class="token string">"#targetUI"</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">remove</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span><span class="token punctuation">,</span> <span class="token function-variable function">error</span><span class="token operator">:</span> <span class="token keyword">function</span> <span class="token punctuation">(</span><span class="token parameter">xhr<span class="token punctuation">,</span> status<span class="token punctuation">,</span> error</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token function">alert</span><span class="token punctuation">(</span>error<span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token keyword">function</span> <span class="token function">setStartStation</span><span class="token punctuation">(</span><span class="token parameter">id<span class="token punctuation">,</span> value</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token function">$</span><span class="token punctuation">(</span><span class="token string">"#StartId"</span><span class="token punctuation">)</span><span class="token punctuation">.</span>val <span class="token operator">=</span> id<span class="token punctuation">;</span> <span class="token function">$</span><span class="token punctuation">(</span><span class="token string">"#SelectedStationStart"</span><span class="token punctuation">)</span><span class="token punctuation">.</span>val <span class="token operator">=</span> value<span class="token punctuation">;</span> <span class="token comment">//remove dropdownlist</span> <span class="token function">$</span><span class="token punctuation">(</span><span class="token string">"#targetUI"</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">remove</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span> <span class="token operator"><</span><span class="token operator">/</span>script<span class="token operator">></span> </code></pre> Keyup Event Syntax Verständnisproblem Thu, 27 Jul 17 14:38:04 Z https://forum.selfhtml.org/self/2017/jul/27/keyup-event-syntax-verstaendnisproblem/1700214#m1700214 https://forum.selfhtml.org/self/2017/jul/27/keyup-event-syntax-verstaendnisproblem/1700214#m1700214 <p>Hello,</p> <blockquote> <p>ich habe einen Javascript Code für eine Textbox geschrieben. Es geht eigentlich um Autovervollständigung - Es soll eine Dropdownliste mit Suchergebnissen angezeigt werden. Dazu wird ein AJAX POST an den Server gesendet, wo ein C# Controller die Ergebnisliste zurückliefern soll. Leider wird die Funktion im Controller aber nicht aufgerufen. Ich vermute, das Keyup Event wird nicht ausgelöst.</p> </blockquote> <p>Das kannst Du z. B. beim Firefox wunderbar mit der Kontroll-Konsole (F12) und der Registerkarte "Netzwerkanalyse" überprüfen.</p> <p>Liebe Grüße<br> Tom S.</p> <div class="signature">-- <br> Es gibt nichts Gutes, außer man tut es<br> Andersdenkende waren noch nie beliebt, aber meistens diejenigen, die die Freiheit vorangebracht haben.<br> </div> Keyup Event Syntax Verständnisproblem Thu, 27 Jul 17 14:51:09 Z https://forum.selfhtml.org/self/2017/jul/27/keyup-event-syntax-verstaendnisproblem/1700216#m1700216 https://forum.selfhtml.org/self/2017/jul/27/keyup-event-syntax-verstaendnisproblem/1700216#m1700216 <p>Tach!</p> <blockquote> <p>Dazu wird ein AJAX POST an den Server gesendet, wo ein C# Controller die Ergebnisliste zurückliefern soll. Leider wird die Funktion im Controller aber nicht aufgerufen. Ich vermute, das Keyup Event wird nicht ausgelöst.</p> </blockquote> <p>Was hast du bereits unternommen, um deine Vermutungen bestätigt oder widerlegt zu bekommen? Sowohl Browser in ihren Entwickler-Tools als auch C# im Visual Studio haben Debugger an Bord. Damit kann man nachvollziehen, was da konkret abläuft, inklusive möglicher Fehlermeldungen.</p> <blockquote> <p>In den Beispielen die ich gefunden habe, gibt es unterschiedliche Herangehensweisen ein Keyup Event an eine Textbox zu koppeln.</p> <p>In meinem Code funktionieren diese aber nicht und ich verstehe nicht wieso.</p> </blockquote> <p>Kontrolliere, ob der Aufruf des Eventhandler bereits schon nicht stattfindet oder wenn doch, wo genau die Ausführung hängt.</p> <blockquote> <p>Es sind JQuery Erweiterungen und ich hab meine Schwierigkeiten dahinter zu steigen, wann das funktioniert.</p> </blockquote> <p>Die müssen so funktionieren, wie in deren Dokumentation beschrieben. Zu wissen, was da konkret im Hintergrund stattfindet, ist nicht unbedingt nötig. Du weißt ja auch nicht unbedingt, was der Compiler konkret aus deinem Code erzeugt und wie der Prozessor das dann abarbeitet. Trotzdem kann man funktionierende Programme schreiben.</p> <blockquote> <p>In meinem Fall funktioniert keins von beiden. Es wäre schön wenn mich jemand aufklären könnte.</p> </blockquote> <p>In erster Linie sollte das der Debugger sein. Bei konkreten Fragen, die sich nicht aus dem Debugging-Vorgang heraus erklären, kannst gern nochmal nachfragen. Aber Debugging ist ein grundlegendes Handwerkszeug eines Programmierers und deshalb möchte ich dir diesen Vorgang und die dabei zu sammelnden Erfahrungen nicht abnehmen. Auch wenn du Fragen zum Debugger/Debugging hast, kannst du die gern stellen.</p> <p>dedlfix.</p> Keyup Event Syntax Verständnisproblem Thu, 27 Jul 17 15:45:51 Z https://forum.selfhtml.org/self/2017/jul/27/keyup-event-syntax-verstaendnisproblem/1700222#m1700222 https://forum.selfhtml.org/self/2017/jul/27/keyup-event-syntax-verstaendnisproblem/1700222#m1700222 <p>Hallo apfelsine,</p> <pre><code class="block language-js"><span class="token function">$</span><span class="token punctuation">(</span>document<span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">ready</span><span class="token punctuation">(</span><span class="token keyword">function</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token comment">//Version 1</span> <span class="token function">$</span><span class="token punctuation">(</span><span class="token string">"#SelectedStationStart"</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">on</span><span class="token punctuation">(</span><span class="token string">"keyup"</span><span class="token punctuation">,</span> <span class="token keyword">function</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">{</span> <span class="token comment">//... some code</span> <span class="token punctuation">}</span> <span class="token comment">//Version 2 </span> <span class="token function">$</span><span class="token punctuation">(</span><span class="token string">"#SelectedStationStart"</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">keyup</span><span class="token punctuation">(</span><span class="token keyword">function</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token comment">//...</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span> </code></pre> <p>Dazu folgende Verständnishinweise. Beachte auch meine Links in die jQuery API Doku, lesen bildet .</p> <ol> <li> <p>jQuery bietet <a href="http://api.jquery.com/ready/" rel="nofollow noopener noreferrer">etliche Varianten</a> an, wie man Code für den Zeitpunkt hinterlegen kann, zu dem das DOM bereit ist. $(document).ready(...) ist eine davon. Wenn Du mit jQuery 3 arbeitest, ist diese Variante allerdings veraltet, bzw. missbilligt („deprecated“), statt dessen soll man den Ready-Handler direkt an die $ Funktion übergeben.<br> <em>Und als ob das noch nicht genug wäre, haben die jQuery-Kameraden ab Version 3 noch was GANZ neues eingefüht: Das <a href="http://api.jquery.com/jQuery.ready" rel="nofollow noopener noreferrer">$.ready Promise</a> - damit kann man das Laden des DOM mit ein paar parallelen Ajax-Requesten ausbremsen.</em><br> Wenn Du den kursiven Teil nicht verstanden hast, ignoriere ihn ;)</p> </li> <li> <p>Genau wie bei den Ready-Handlern ist auch das Event-Handling in jQuery ein Wirrwarr aus Altlasten und Neubauten. <a href="http://api.jquery.com/category/events/event-handler-attachment/" rel="nofollow noopener noreferrer">Hier ist eine Übersicht</a>. Wie man sieht, ist die Hälfte deprecated oder removed.<br> $(selector).keyup(function) und $(selector).on("keyup", function) sind synonym. <a href="http://api.jquery.com/keyup/" rel="nofollow noopener noreferrer"><code>.keyup</code></a> stammt aus jQuery 1.0, <a href="http://api.jquery.com/on/" rel="nofollow noopener noreferrer"><code>.on</code></a> aus jQuery 1.7. Seit es <code>.on</code> gibt, verweist <code>.keyup</code> nur noch darauf.</p> </li> </ol> <p><em>Rolf</em></p> <div class="signature">-- <br> Dosen sind silbern </div> Keyup Event Syntax Verständnisproblem Thu, 27 Jul 17 16:12:24 Z https://forum.selfhtml.org/self/2017/jul/27/keyup-event-syntax-verstaendnisproblem/1700224#m1700224 https://forum.selfhtml.org/self/2017/jul/27/keyup-event-syntax-verstaendnisproblem/1700224#m1700224 <p>Ich hatte eine Idee und habe mein Problem in eine einfache HTML Seite verlagert, um zu sehen, ob ich der Wurzel etwas näher komme.</p> <p>Offenbar funktionieren grundsätzlich in der Tat beide Aufrufe. Aber nicht, wenn ich sie in die</p> <p>**$(document).ready() ** Funktion packe. Vielleicht ein Syntaxfehler… [edit] oder falsche Jquery Version [/edit]</p> <p>Danke für eure Antworten, es hat mir geholfen. Ich sitze wohl echt schon zu lange dran.</p> <pre><code class="block language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>html</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>head</span><span class="token punctuation">></span></span><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>meta</span> <span class="token attr-name">http-equiv</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>Content-type<span class="token punctuation">"</span></span> <span class="token attr-name">content</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>text/html;charset=UTF-8<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>link</span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>file:///C:/Daten/Onlinesourcen/NopCommerce_3.90/Presentation/Nop.Web/Content/jquery-ui-themes/smoothness/jquery-ui-1.10.3.custom.min.css<span class="token punctuation">"</span></span> <span class="token attr-name">rel</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>stylesheet<span class="token punctuation">"</span></span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>text/css<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>script</span> <span class="token attr-name">src</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>file:///C:/Daten/Onlinesourcen/NopCommerce_3.90/Presentation/Nop.Web/Scripts/jquery-1.10.2.min.js<span class="token punctuation">"</span></span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>text/javascript<span class="token punctuation">"</span></span><span class="token punctuation">></span></span><span class="token script"></span><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>script</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>script</span> <span class="token attr-name">src</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>file:///C:/Daten/Onlinesourcen/NopCommerce_3.90/Presentation/Nop.Web/Scripts/jquery.validate.min.js<span class="token punctuation">"</span></span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>text/javascript<span class="token punctuation">"</span></span><span class="token punctuation">></span></span><span class="token script"></span><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>script</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>script</span> <span class="token attr-name">src</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>file:///C:/Daten/Onlinesourcen/NopCommerce_3.90/Presentation/Nop.Web/Scripts/jquery.validate.unobtrusive.min.js<span class="token punctuation">"</span></span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>text/javascript<span class="token punctuation">"</span></span><span class="token punctuation">></span></span><span class="token script"></span><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>script</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>script</span> <span class="token attr-name">src</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>file:///C:/Daten/Onlinesourcen/NopCommerce_3.90/Presentation/Nop.Web/Scripts/jquery-ui-1.10.3.custom.min.js<span class="token punctuation">"</span></span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>text/javascript<span class="token punctuation">"</span></span><span class="token punctuation">></span></span><span class="token script"></span><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>script</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>script</span> <span class="token attr-name">src</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>file:///C:/Daten/Onlinesourcen/NopCommerce_3.90/Presentation/Nop.Web/Scripts/jquery-migrate-1.2.1.min.js<span class="token punctuation">"</span></span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>text/javascript<span class="token punctuation">"</span></span><span class="token punctuation">></span></span><span class="token script"></span><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>script</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>script</span> <span class="token attr-name">src</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>file:///C:/Daten/Onlinesourcen/NopCommerce_3.90/Presentation/Nop.Web/Scripts/public.common.js<span class="token punctuation">"</span></span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>text/javascript<span class="token punctuation">"</span></span><span class="token punctuation">></span></span><span class="token script"></span><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>script</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>script</span> <span class="token attr-name">src</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>file:///C:/Daten/Onlinesourcen/NopCommerce_3.90/Presentation/Nop.Web/Scripts/public.ajaxcart.js<span class="token punctuation">"</span></span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>text/javascript<span class="token punctuation">"</span></span><span class="token punctuation">></span></span><span class="token script"></span><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>script</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>body</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>script</span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>text/javascript<span class="token punctuation">"</span></span><span class="token punctuation">></span></span><span class="token script"><span class="token language-javascript"> <span class="token function">$</span><span class="token punctuation">(</span><span class="token keyword">function</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token comment">/* funktioniert $("#SelectedStationStart").keyup(function () { //get value from input textbox alert("keyup"); });*/</span> <span class="token comment">//funktioniert</span> <span class="token function">$</span><span class="token punctuation">(</span><span class="token string">"#SelectedStationStart"</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">on</span><span class="token punctuation">(</span><span class="token string">"keyup"</span><span class="token punctuation">,</span> <span class="token keyword">function</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">{</span> <span class="token comment">//$("#SelectedStationStart").keyup(function () {</span> <span class="token comment">//get value from input textbox</span> <span class="token function">alert</span><span class="token punctuation">(</span><span class="token string">"keyup"</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token keyword">var</span> query <span class="token operator">=</span> <span class="token function">$</span><span class="token punctuation">(</span><span class="token keyword">this</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">val</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token function">alert</span><span class="token punctuation">(</span>query<span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">//fetch values for searchterm</span> <span class="token comment">//getItems(query);</span> <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token function">$</span><span class="token punctuation">(</span>document<span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">ready</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token operator">**</span>funktioniert nicht<span class="token operator">??</span><span class="token operator">?</span><span class="token operator">**</span> <span class="token punctuation">}</span><span class="token punctuation">;</span> </span></span><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>script</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>div</span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>targetDiv<span class="token punctuation">"</span></span><span class="token punctuation">></span></span><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>input</span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>text<span class="token punctuation">"</span></span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>SelectedStationStart<span class="token punctuation">"</span></span> <span class="token punctuation">/></span></span><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>input</span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>hidden<span class="token punctuation">"</span></span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>StartId<span class="token punctuation">"</span></span> <span class="token punctuation">/></span></span><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>div</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>body</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>html</span><span class="token punctuation">></span></span> </code></pre> Keyup Event Syntax Verständnisproblem Thu, 27 Jul 17 14:51:05 Z https://forum.selfhtml.org/self/2017/jul/27/keyup-event-syntax-verstaendnisproblem/1700215#m1700215 https://forum.selfhtml.org/self/2017/jul/27/keyup-event-syntax-verstaendnisproblem/1700215#m1700215 <p>Den hab ich schon erfolglos benutzt. Ich bin scheinbar zu doof dafür. Ich sehe da rein garnichts. Haltepunkt in das Event gesetzt. läuft nicht rein . Nichtmal eine kleine Fehlermeldung. Das beantwortet mir aber auch leider nicht die Frage, wo denn nun der Unterschied zwischen den beiden Syntax ist. Beide habe ich in Beispielen die angeblich funktionieren gefunden und keins von beiden funktioniert bei mir. Ich finde die Jquery "Syntax" schwer zu durchschauen.</p> Keyup Event Syntax Verständnisproblem Thu, 27 Jul 17 14:59:10 Z https://forum.selfhtml.org/self/2017/jul/27/keyup-event-syntax-verstaendnisproblem/1700217#m1700217 https://forum.selfhtml.org/self/2017/jul/27/keyup-event-syntax-verstaendnisproblem/1700217#m1700217 <blockquote> <p>Was hast du bereits unternommen, um deine Vermutungen bestätigt oder widerlegt zu bekommen?</p> </blockquote> <p>Wenn der Debugger mir etwas sagen würde, das ich erkennen kann, die Haltepunkte funktionieren nicht. Daraus schließe ich, das es nicht in das Eventhandling läuft.</p> <p>aber ich bin wahrscheinlich schon zu lange dran. Ich sehe es nicht. vielleicht bin ich schon blind. Es gibt auch keine Fehlermeldung. Und es erklärt immernoch nicht den Unterschied zwischen beiden Zeilen. Denn sie funktionieren ja nicht.</p> <p><a href="/images/ae7d17b7-c983-4a63-972a-c0ac3c1a1d5a.jpg" rel="noopener noreferrer"><img src="/images/ae7d17b7-c983-4a63-972a-c0ac3c1a1d5a.jpg?size=medium" alt="" loading="lazy"></a></p> Keyup Event Syntax Verständnisproblem Thu, 27 Jul 17 15:12:29 Z https://forum.selfhtml.org/self/2017/jul/27/keyup-event-syntax-verstaendnisproblem/1700219#m1700219 https://forum.selfhtml.org/self/2017/jul/27/keyup-event-syntax-verstaendnisproblem/1700219#m1700219 <blockquote> <p>Was hast du bereits unternommen, um deine Vermutungen bestätigt oder widerlegt zu bekommen?</p> </blockquote> <p>ein im Code angebrachtes alert("test") wird nicht angezeigt</p> <pre><code class="block language-javascript"> <span class="token function">$</span><span class="token punctuation">(</span><span class="token string">"#SelectedStationStart"</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">on</span><span class="token punctuation">(</span><span class="token string">"keyup"</span><span class="token punctuation">,</span> <span class="token keyword">function</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">{</span> <span class="token comment">//$("#SelectedStationStart").keyup(function () {</span> <span class="token comment">//get value from input textbox</span> <span class="token function">alert</span><span class="token punctuation">(</span><span class="token string">"keyup"</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token keyword">var</span> query <span class="token operator">=</span> <span class="token function">$</span><span class="token punctuation">(</span><span class="token keyword">this</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">val</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">//fetch values for searchterm</span> <span class="token function">getItems</span><span class="token punctuation">(</span>query<span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span> </code></pre> Keyup Event Syntax Verständnisproblem Thu, 27 Jul 17 15:16:33 Z https://forum.selfhtml.org/self/2017/jul/27/keyup-event-syntax-verstaendnisproblem/1700221#m1700221 https://forum.selfhtml.org/self/2017/jul/27/keyup-event-syntax-verstaendnisproblem/1700221#m1700221 <p>Tach!</p> <blockquote> <blockquote> <p>Was hast du bereits unternommen, um deine Vermutungen bestätigt oder widerlegt zu bekommen? Wenn der Debugger mir etwas sagen würde, das ich erkennen kann, die Haltepunkte funktionieren nicht. Daraus schließe ich, das es nicht in das Eventhandling läuft.</p> </blockquote> </blockquote> <p>Es läuft schon viel früher nicht wie geplant. Aber der Reihe nach, aber erstmal eher stichpunkthaft als in ganzen Sätzen: Event wird nicht ausgelöst, Debugger springt nicht bei einem Breakpoint im Eventhandler an. Wird das Setzen des Eventhandlers überhaupt aufgerufen? Breakpoint in die Zeile mit der Zuweisung setzen. Auch kein Anspringen? Der Code wird gar nicht ausgeführt. Aber der <script>-Block wird beachtet? Kontrollausgabe darein schreiben. Wird ausgeführt. Hmm, stimmt was mit dem $(document).ready() nicht?</p> <p>Die Antwort darauf lautet ja. Das Hauptproblem ist falsche Syntax, die aber keinen Fehler erzeugt, weil sie formal richtig ist.</p> <blockquote> <pre><code class="block language-javascript"> <span class="token function">$</span><span class="token punctuation">(</span>document<span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">ready</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token comment">// ...</span> <span class="token punctuation">}</span> </code></pre> </blockquote> <p>Du rufst $(document).ready() auf und anschließend hast du einen Block innerhalb der {}-Klammern notiert, der nicht weiter ausgeführt wird. Der Block muss stattdessen der Körper einer Funktion sein, und die musst du mit function() einleiten. Zudem muss diese Funktion als Parameter von ready() übergeben werden.</p> <pre><code class="block language-javascript"><span class="token function">$</span><span class="token punctuation">(</span>document<span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">ready</span><span class="token punctuation">(</span><span class="token keyword">function</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span> <span class="token string">"ready!"</span> <span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span> </code></pre> <p>So muss das Grundgerüst aussehen, damit das was in dem Funktionskörper steht (hier das console.log), zum Zeitpunkt des Document-Ready-Eregnisses ausgeführt wird. Und nun müssen auch die Breakpoints bremsen.</p> <p>Und noch ein Punkt: In Javascript ist das Semikolon optional. Das heißt, dass es am Zeilenende in einigen Fällen als implizit vorhanden angenommen wird. Wenn du die {-Klammer nicht in die nächste Zeile geschrieben hättest, hättest du einen Syntaxfehler zu sehen bekommen. Es ist besser, in Javascript den <a href="https://de.wikipedia.org/wiki/Einr%C3%BCckungsstil" rel="nofollow noopener noreferrer">1TBS-Style</a> zu verwenden, um zumindest eine Fehlerstelle für automatisches Semikolon zu vermeiden.</p> <p>dedlfix.</p> Keyup Event Syntax Verständnisproblem Thu, 27 Jul 17 17:51:25 Z https://forum.selfhtml.org/self/2017/jul/27/keyup-event-syntax-verstaendnisproblem/1700228#m1700228 https://forum.selfhtml.org/self/2017/jul/27/keyup-event-syntax-verstaendnisproblem/1700228#m1700228 <p>Hi,</p> <blockquote> <p>Und nun müssen auch die Breakpoints bremsen.</p> </blockquote> <p>brechen. (to break = brechen, to brake = bremsen)</p> <p>cu,<br> Andreas a/k/a MudGuard</p> Keyup Event Syntax Verständnisproblem Fri, 28 Jul 17 10:42:04 Z https://forum.selfhtml.org/self/2017/jul/27/keyup-event-syntax-verstaendnisproblem/1700275#m1700275 https://forum.selfhtml.org/self/2017/jul/27/keyup-event-syntax-verstaendnisproblem/1700275#m1700275 <p>Hi,</p> <p>danke, das klärt es auf :-)</p> <p>lg apfelsine</p> Keyup Event Syntax Verständnisproblem Fri, 28 Jul 17 11:53:52 Z https://forum.selfhtml.org/self/2017/jul/27/keyup-event-syntax-verstaendnisproblem/1700282#m1700282 https://forum.selfhtml.org/self/2017/jul/27/keyup-event-syntax-verstaendnisproblem/1700282#m1700282 <p>Nachtrag zur Info, weil ich dieses kleine Detail wichtig finde und eben auch mich in die Irre geführt hat.</p> <blockquote> <p>Das Hauptproblem ist falsche Syntax, die aber keinen Fehler erzeugt, weil sie formal richtig ist.</p> <blockquote> <pre><code class="block language-javascript"> <span class="token function">$</span><span class="token punctuation">(</span>document<span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">ready</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token comment">// ...</span> <span class="token punctuation">}</span> </code></pre> </blockquote> <p>Du rufst $(document).ready() auf und anschließend hast du einen Block innerhalb der {}-Klammern notiert, der nicht weiter ausgeführt wird. Der Block muss stattdessen der Körper einer Funktion sein, und die musst du mit function() einleiten. Zudem muss diese Funktion als Parameter von ready() übergeben werden.</p> </blockquote> <p>Ein Test im Browser (Edge und Firefox) ergab, das ein eingefügtes Alert</p> <p>$(document).ready() { alert("test");</p> <p>in dieser fehlerhaften Funktion dennoch ausgeführt wird. Nur die Funktionalität die mit $(document).ready eigentlich angesprochen werden sollte, die darauf angewiesen ist, das es zur Zeit der Initialisierung geschieht, wird nicht ausgeführt. Was nach deiner Ausführung ja auch Sinn macht :-)</p> <p>Also das alert "test" erscheint aber "keyup" wird in dieser Ausführung dann auch nicht angezeigt:</p> <pre><code class="block language-javascript"><span class="token function">$</span><span class="token punctuation">(</span>document<span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">ready</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token function">alert</span><span class="token punctuation">(</span><span class="token string">"test"</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token function">$</span><span class="token punctuation">(</span><span class="token string">"#SelectedStationStart"</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">keyup</span><span class="token punctuation">(</span><span class="token keyword">function</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token comment">//get value from input textbox</span> <span class="token function">alert</span><span class="token punctuation">(</span><span class="token string">"keyup"</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span><span class="token punctuation">}</span> </code></pre> Keyup Event Syntax Verständnisproblem Thu, 27 Jul 17 16:14:13 Z https://forum.selfhtml.org/self/2017/jul/27/keyup-event-syntax-verstaendnisproblem/1700225#m1700225 https://forum.selfhtml.org/self/2017/jul/27/keyup-event-syntax-verstaendnisproblem/1700225#m1700225 <p>Das ist super! Danke für das entwirren :-D <3 Du ahnst ja nicht wieviele Textlawinen ich schon gelesen habe.</p> Keyup Event Syntax Verständnisproblem Fri, 28 Jul 17 12:25:03 Z https://forum.selfhtml.org/self/2017/jul/27/keyup-event-syntax-verstaendnisproblem/1700289#m1700289 https://forum.selfhtml.org/self/2017/jul/27/keyup-event-syntax-verstaendnisproblem/1700289#m1700289 <p>Hallo apfelsine,</p> <p>nur mal so als Anregung (auch für andere Leser), es führen viele Wege nach Rom, nur manche schwer, manche leichter. Du nutzt hier ein Monster an Frameworks und vielleicht, kenne ja nicht alle deine Ansprüche, geht es <a href="http://leaverou.github.io/awesomplete/#advanced-examples" rel="nofollow noopener noreferrer">einfacher zu realisieren</a>. Oder für <a href="https://www.mittwald.de/blog/mittwald/howtos/autovervollstaendigung-mit-html5" rel="nofollow noopener noreferrer">ganz wenige Ansprüche</a>.</p> <p>Gruss<br> Henry</p> Keyup Event Syntax Verständnisproblem Thu, 27 Jul 17 18:23:15 Z https://forum.selfhtml.org/self/2017/jul/27/keyup-event-syntax-verstaendnisproblem/1700229#m1700229 https://forum.selfhtml.org/self/2017/jul/27/keyup-event-syntax-verstaendnisproblem/1700229#m1700229 <p>Tach!</p> <blockquote> <blockquote> <p>Und nun müssen auch die Breakpoints bremsen.</p> </blockquote> <p>brechen. (to break = brechen, to brake = bremsen)</p> </blockquote> <p>Ich bremse auch für Breakpoints.</p> <p>dedlfix.</p> Keyup Event Syntax Verständnisproblem Thu, 27 Jul 17 20:34:17 Z https://forum.selfhtml.org/self/2017/jul/27/keyup-event-syntax-verstaendnisproblem/1700236#m1700236 https://forum.selfhtml.org/self/2017/jul/27/keyup-event-syntax-verstaendnisproblem/1700236#m1700236 <p>Hallo,</p> <blockquote> <blockquote> <p>Und nun müssen auch die Breakpoints bremsen.</p> </blockquote> <p>brechen. (to break = brechen, to brake = bremsen)</p> </blockquote> <p>brechen: to throw up also Punkte hochwerfen</p> <p>Gruß<br> Kalk</p> Keyup Event Syntax Verständnisproblem Fri, 28 Jul 17 12:10:05 Z https://forum.selfhtml.org/self/2017/jul/27/keyup-event-syntax-verstaendnisproblem/1700285#m1700285 https://forum.selfhtml.org/self/2017/jul/27/keyup-event-syntax-verstaendnisproblem/1700285#m1700285 <p>Hallo apfelsine,</p> <p>dass der alert kommt, ist logisch. Das Problem wird deutlicher, wenn man den Code noch etwas erweitert.</p> <pre><code class="block language-js"> <span class="token function">$</span><span class="token punctuation">(</span>document<span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">ready</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token function">alert</span><span class="token punctuation">(</span><span class="token string">"Yahoo!"</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token function">$</span><span class="token punctuation">(</span><span class="token string">"#foo"</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">on</span><span class="token punctuation">(</span><span class="token string">"click"</span><span class="token punctuation">,</span> <span class="token keyword">function</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token comment">/* some handler */</span> <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span> </code></pre> <ol> <li>Aufruf der ready-Funktion auf dem wrapped set um das document Objekt, ohne Übergabe eines Parameters. D.h. du sagst jQuery: Registriere bitte ein NICHTS als ErrorHandler. Ok. Tut es. Fertig. Oh, da fehlt ein Semikolon! Macht nichts. JavaScript verzeiht es Dir (einer der häßlichsten Schwachpunkte von JavaScript, den man ihm selbst im strict mode nicht abgewöhnen kann).</li> <li>Nun kommt ein Statement-Block, bestehend aus dem Aufruf der alert-Funktion, und einer qQuery Eventregistrierung. Da dieser Block kein if oder so vor sich hat, werden die Statements darin ausgeführt, und zwar genau an der Stelle, wo er geschrieben ist. HTML, dass nach ihm folgt, hat sich der Browser noch keines Blickes gewürdigt. Eine Blockbildung dieser Art ist syntaktisch erlaubt, wenn auch sinnlos in älterem JavaScript. In neuerem JavaScript (ES6) könnte man darin lokale Variablen kapseln (let Befehl).</li> </ol> <p>D.h. der alert() wird problemlos ausgeführt. Ob die Eventregistrierung funktioniert, hängt davon ab, wo der Script-Block steht. Befindet er sich unterhalb des Elements mit id="foo", funktioniert er. Befindet er sich oberhalb (z.B. im head), liefert $("#foo") ein leeres wrapped set. Eine jQuery-Funktion, die auf einem leeren wrapped set aufgerufen wird, tut einfach gar nichts.</p> <p><em>Rolf</em></p> <div class="signature">-- <br> Mimosen sind grün </div> Keyup Event Syntax Verständnisproblem Fri, 28 Jul 17 12:10:08 Z https://forum.selfhtml.org/self/2017/jul/27/keyup-event-syntax-verstaendnisproblem/1700286#m1700286 https://forum.selfhtml.org/self/2017/jul/27/keyup-event-syntax-verstaendnisproblem/1700286#m1700286 <p>Tach!</p> <blockquote> <blockquote> <p>Das Hauptproblem ist falsche Syntax, die aber keinen Fehler erzeugt, weil sie formal richtig ist.</p> <blockquote> <pre><code class="block language-javascript"> <span class="token function">$</span><span class="token punctuation">(</span>document<span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">ready</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token comment">// ...</span> <span class="token punctuation">}</span> </code></pre> </blockquote> <p>Du rufst $(document).ready() auf und anschließend hast du einen Block innerhalb der {}-Klammern notiert, der nicht weiter ausgeführt wird. Der Block muss stattdessen der Körper einer Funktion sein, und die musst du mit function() einleiten. Zudem muss diese Funktion als Parameter von ready() übergeben werden.</p> </blockquote> <p>Ein Test im Browser (Edge und Firefox) ergab, das ein eingefügtes Alert</p> <p>$(document).ready() { alert("test");</p> <p>in dieser fehlerhaften Funktion dennoch ausgeführt wird.</p> </blockquote> <p>Entschuldigung, mein Fehler. Der Block wird natürlich ausgeführt, nur nicht zum Zeitpunkt des Document-Ready, sondern bereits dann, wenn der Browser den Code parst.</p> <blockquote> <p>Nur die Funktionalität die mit $(document).ready eigentlich angesprochen werden sollte, die darauf angewiesen ist, das es zur Zeit der Initialisierung geschieht, wird nicht ausgeführt. Was nach deiner Ausführung ja auch Sinn macht :-)</p> </blockquote> <p>Die beiden Funktionen werden angelegt, auch das $("#SelectedStationStart") wird aufgerufen, aber da kein Element mit dieser ID zu dem Zeitpunkt vorhanden ist, kann dem kein Event-Handler angehängt werden. Zumindest gilt das, wenn der fragliche Javascript-Code im Header steht oder von dort referenziert wird und dabei keine Ausführungsverzögerung angegeben ist (defer). Steht er am Dokumentende, sind die HTML-Elemente bereits im DOM vorhanden und der Eventhandler sollte erfolgreich angehängt werden können, auch ohne dass der Document-Ready-Handler funktioniert.</p> <p>dedlfix.</p> Keyup Event Syntax Verständnisproblem Fri, 28 Jul 17 12:17:05 Z https://forum.selfhtml.org/self/2017/jul/27/keyup-event-syntax-verstaendnisproblem/1700287#m1700287 https://forum.selfhtml.org/self/2017/jul/27/keyup-event-syntax-verstaendnisproblem/1700287#m1700287 <p>Hallo dedlfix,</p> <p><em>highfive</em> - wir haben den Synchronpost minutengenau geschafft </p> <p><em>Rolf</em></p> <div class="signature">-- <br> Dosen sind silbern </div> Keyup Event Syntax Verständnisproblem Fri, 28 Jul 17 12:43:39 Z https://forum.selfhtml.org/self/2017/jul/27/keyup-event-syntax-verstaendnisproblem/1700291#m1700291 https://forum.selfhtml.org/self/2017/jul/27/keyup-event-syntax-verstaendnisproblem/1700291#m1700291 <p>Ich bin deiner Meinung. In diesem Fall jedoch ist es ist eine nicht ganz kleine Shopanwendung die auf NopCommerce basiert. Mit zahlreichen Plugins und unzählige ineinander verschachtelte Views. Ich hab einfach nur den Header aus der kompilierten Seite kopiert damit es prinzipiell funktioniert. Was davon tatsächlich verwendet wird und von welchem Plugin..... es fehlt mir aktuell die Zeit und der Nerv dem nachzugehen. Vielleicht später. Sicher hätte ich für meinen Test lediglich 2 Zeilen benötigt von den 10 </p>