[gelöst] jquery script an falscher Stelle?
Eingetragen von stixer2 (113)am 31.08.2015 - 10:00 Uhr in
Hi.
Auf einigen Seiten sollen bestimmte Wörter automatisch blau ausgegeben werden. Das habe ich mit einem jquery script gelöst, dass ich in einen Block geschrieben habe, und zwar folgendes:
<script type="text/javascript">
$(document).ready(function(){
$.fn.wrapInTag = function (opts) {
// http://stackoverflow.com/a/1646618
function getText(obj) {
return obj.textContent ? obj.textContent : obj.innerText;
}
var tag = opts.tag || 'span class="blau"',
words = opts.words || [],
regex = RegExp(words.join('|'), 'gi'),
replacement = '<' + tag + '>$&</' + tag + '>';
$(this).contents().each(function () {
if (this.nodeType === 3) //Node.TEXT_NODE
{
$(this).replaceWith(getText(this).replace(regex, replacement));
}
else if (!opts.ignoreChildNodes) {
$(this).wrapInTag(opts);
}
});
};
$('p').wrapInTag({"words" : ["Asyl", "Asyl suchen", "Aufenthalts-Erlaubnis zum Zwecke der Erwerbs-Tätigkeit", "Aufenthalts-Erlaubnis", "Aufenthalts-Gesetz", "Ausländer-Behörde", "Beschäftigungs-Erlaubnis", "Deutsche Botschaft", "Deutschen Botschaft", "Deutsches Konsulat", "Deutschen Konsulat", "Dritt-Staaten-Angehörige", "Europäischen Union", "Einsatz-Stelle", "Erklärung gemäß Aufenthalts-Gesetz § 55 Abs. 2", "Grund-Sicherung", "Motivations-Schreiben mit Angaben zu beruflichen Perspektiven nach dem Freiwilligen-Dienst", "Motivations-Schreiben", "Nachweise zur Lebens-Unterhalts-Sicherung", "Paragraf 55, Absatz 2 des Aufenthalts-Gesetz", "§ 55 Abs. 2", "§55 Abs. 2", "Paragraf 55, Absatz 2", "Sozial-Leistungen", "Stufe A1", "Träger", "Vereinbarung über den Freiwilligen-Dienst", "Visum"]});
$('li').wrapInTag({"words" : ["Asyl", "Asyl suchen", "Aufenthalts-Erlaubnis zum Zwecke der Erwerbs-Tätigkeit", "Aufenthalts-Erlaubnis", "Aufenthalts-Gesetz", "Ausländer-Behörde", "Beschäftigungs-Erlaubnis", "Deutsche Botschaft", "Deutschen Botschaft", "Deutsches Konsulat", "Deutschen Konsulat", "Dritt-Staaten-Angehörige", "Europäischen Union", "Einsatz-Stelle", "Erklärung gemäß Aufenthalts-Gesetz § 55 Abs. 2", "Grund-Sicherung", "Motivations-Schreiben mit Angaben zu beruflichen Perspektiven nach dem Freiwilligen-Dienst", "Motivations-Schreiben", "Nachweise zur Lebens-Unterhalts-Sicherung", "Paragraf 55, Absatz 2 des Aufenthalts-Gesetz", "§ 55 Abs. 2", "§55 Abs. 2", "Paragraf 55, Absatz 2", "Sozial-Leistungen", "Stufe A1", "Träger", "Vereinbarung über den Freiwilligen-Dienst", "Visum"]});
});
</script>Leider lädt das script nicht, bzw. nur dann, wenn ich <script src="http://code.jquery.com/jquery-1.7.2.min.js"></script> im template hinter <?php print $scripts; ?> schreibe. Dann klappt es. Allerdings finktionieren dann z.B. die Accordions nicht mehr.
Grundlegend wird aber jquery ja geladen, also vermute ich, nur an der falschen Stellen für das script.
Es ist offensichtlich, dass ich (noch) keine große Ahnung von jquery habe… wie kann ich ‘p‘ und ‘li‘ zusammenfassen? kann ich einfach $(‘p‘, ‘li‘) schreiben?
Danke und Grüße!
- Anmelden oder Registrieren um Kommentare zu schreiben
Du kannst nicht einfach die
am 31.08.2015 - 10:39 Uhr
Du kannst nicht einfach die $-Funktion voraussetzen. Die ist in dieser Form in Drupal 7 nicht sofort vorhanden. Sieh Dir im Zen-Theme das Beispiel-Script im js-Unterordner an, dann verstehst Du was ich meine.
jQuery arbeitet mit "normalen" CSS-Selektoren (ok, es gibt auch ein paar zusätzliche). Also wäre li nach p wie sonst auch $('p li').
alternativ kannst du auch
am 31.08.2015 - 11:23 Uhr
alternativ kannst du auch einfach das modul lexikon oder g2 nutzen. damit hast du gleichzeitig eine Verlinkung zu erklärungen
Zitat:Du kannst nicht
am 31.08.2015 - 11:48 Uhr
Du kannst nicht einfach die $-Funktion voraussetzen.
Das verstehe ich nicht. Das script funktioniert ja, offenbar nur, wenn jquery an der richtigen Stelle eingebunden wird…
So funktioniert es nicht:
<script src="//code.jquery.com/jquery-1.7.2.min.js"></script><script>window.jQuery || document.write("<script src='/sites/all/modules/jquery_update/replace/jquery/1.7/jquery.min.js'>\x3C/script>")</script>
<script [mehr scripte folgen hier]
so funktioniert es:
<script src="//code.jquery.com/jquery-1.7.2.min.js"></script><script>window.jQuery || document.write("<script src='/sites/all/modules/jquery_update/replace/jquery/1.7/jquery.min.js'>\x3C/script>")</script>
<script src […]</script>
<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script src="//use.typekit.net/
Jetzt steht das 2x da (klar), und offenbar läuft es, weil er jquery nach all den anderen scripten lädt. Oder ist das Unsinn, den ich mir da denke?
G2 kannte ich noch nicht, das
am 31.08.2015 - 11:52 Uhr
G2 kannte ich noch nicht, das scheint ja für D7 zu funktionieren… so was hatte ich eiegtnlich gesucht, aber nichts vernünftiges für D7 gefunden. Ich teste das mal. Lexikon war mir zu fett, es geht ja nur um 10, 15 Wörter…
Ansonsten würde mich das schon noch interessieren, wie ich jquery ordentlich in Drupal einbinden kann. Alle Foren und Blogs etc. gehen irgendwie davon aus, dass man weiß, wie das geht… ich weiß es nicht, will es aber lernen. Es scheint, als sei das simplere an js das schwierigste im Moment für mich…
Danke und Grüße!
jquery brauchst du ja nicht
am 31.08.2015 - 13:19 Uhr
jquery brauchst du ja nicht einzubinden. das ist schon eingebunden. nur die funktionen mußt du dann einbinden https://www.drupal.org/node/171213
/ We define a function that takes one parameter named $.
(function ($) {
// Use jQuery with the shortcut:
console.log($.browser);
// Here we immediately call the function with jQuery as the parameter.
}(jQuery));
The .ready() function also has the ability to alias the jQuery object:
jQuery(document).ready(function($) {
// Code that uses jQuery's $ can follow here.
});
Aaah, perfekt. So klappt
am 31.08.2015 - 14:32 Uhr
Aaah, perfekt. So klappt es.
Merci!