Seite 1 von 2

[Javascript] Querverweis soll Lesezeichen mit Ankernamen anl

Verfasst: 14.08.2012 15:21
von WPö
Hallo, Leute!

Stecke gerade mitten in Javascript fest und komme nicht mehr weiter. Mit JS hatte ich bisher zum Glück sehr wenig zu tun. Ich hoffe, jemand von Euch weiß da etwas, was meinen Knoten zum Platzen bringt. :roll:

Der Navigator soll beim Klicken auf einen Querverweis ein Lesezeichen anlegen - aber mit Ankernamen. Bis jetzt habe ich eine Routine aus dem Netz gefischt, die sehr "alpha" aussieht. Wie so oft - ein Bild sagt mehr als 1000 Wörter; deshalb hier als XHTML-Quelltext:

Code: Alles auswählen

<?xml version="1.0" encoding="ISO-8859-15" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">
 <head>
  <meta http-equiv="content-type" content="text/html; charset=ISO-8859-15" />
  <meta http-equiv="content-language" content="de" />
  <meta http-equiv="content-script-type" content="text/javascript" />
  <meta http-equiv="content-style-type" content="text/css" />
  <meta name="robots" content="noindex" />
  <title>Elektronikkurs</title>
  <style type="text/css">
   <!--
   * {font-family: "Times New Roman", Times, serif; font-size: 100.01%; font-weight: normal; text-decoration: none; margin: 0; padding: 0;}
   div#mitte {min-width: 25em; max-width: 45em; margin: 0 auto; padding: 0 1em;}
   h2 {margin: 1em 0; font-size: 1.25em; font-weight: bold;}
   div.rechterRand {width: 11em; margin: 0 0 0.25em 0.5em; float: right;}
   img {width: 100%; margin-top: 0.5em; border-radius: 0.5em;}
   a {font-weight: bold;}
   p.Bildunterschrift {margin-top: 0.5em; font-size: 0.7em; font-weight: bold;}
   dt {font-size: 1.13em; font-weight: bold; margin-top: 0.25em; background-color: #e0ffe0;}
   strong {font-weight: bold;}
   em {font-style: italic;}
   -->
  </style>
  <script type="text/javascript" language="JavaScript1.2">
   <!--
   ATBookmarkApp = function () {
     var isIEmac = false; /*@cc_on @if(@_jscript&&!(@_win32||@_win16)&& (@_jscript_version<5.5)) isIEmac=true; @end @*/
     var isMSIE = (-[1,]) ? false : true;
     var cjTitle = document.title;
     var cjHref = location.href;
     function hotKeys() {
       var ua = navigator.userAgent.toLowerCase();
       var str = "";
       var isWebkit = (ua.indexOf("webkit") != - 1);
       var isMac = (ua.indexOf("mac") != - 1);
       if (ua.indexOf("konqueror") != - 1) {
         str = "CTRL + B"; // Konqueror
       } else if (window.home || isWebkit || isIEmac || isMac) {
         str = (isMac ? "Command/Cmd" : "CTRL") + " + D"; // Netscape, Safari, iCab, IE5/Mac
       }
       return ((str) ? "Press " + str + " to bookmark this page." : str);
     }
     function isIE8() {
       var rv = -1;
       if (navigator.appName == "Microsoft Internet Explorer") {
         var ua = navigator.userAgent;
         var re = new RegExp("MSIE ([0-9]{1,}[\.0-9]{0,})");
         if (re.exec(ua) != null) rv = parseFloat(RegExp.$1);
       }
       if (rv > - 1) {
         if (rv >= 8.0) return true;
       }
       return false;
     }
     function addBookmark(a) {
       try {
         if (typeof a == "object" && a.tagName.toLowerCase() == "a") {
           a.style.cursor = "pointer";
           if ((typeof window.sidebar == "object") && (typeof window.sidebar.addPanel == "function")) {
             window.sidebar.addPanel(cjTitle, cjHref, ""); // Gecko
             return false;   
           } else if (isMSIE && typeof window.external == "object") {
             if (isIE8()) {
               window.external.AddToFavoritesBar(cjHref, cjTitle); // IE 8                    
             } else {
               window.external.AddFavorite(cjHref, cjTitle); // IE <=7
             }
             return false;
           } else if (window.opera) {
             a.href = cjHref;
             a.title = cjTitle;
             a.rel = "sidebar"; // Opera 7+
             return true;
           } else {
             alert(hotKeys());
           }
         } else {
           throw "Error occured.\r\nNote, only A tagname is allowed!";
         }
       } catch (err) {
         alert(err);
       }
     }
     return {addBookmark : addBookmark}
   }();
   //-->
  </script>
 </head>
 <body>
  <div id="mitte">
   <div class="rechterRand">
    <a name="Abb01" id="Abb01"></a>
    <img src="https://xn--wp-gka.de/Gfx/EK/Platinegrn.jpg" alt="Platine" title="Platine, wie Elektronik eben aussieht." />
    <p class="Bildunterschrift"><a href="#Abb01" title="Anker zu Lesezeichen hinzuf&uuml;gen." onclick="return ATBookmarkApp.addBookmark(this)">Abb. 1:</a> Moderne Elektronik mit beidseitiger Mischbest&uuml;ckung THT/SMT.</p>
    <a name="Abb02" id="Abb02"></a>
    <img src="https://xn--wp-gka.de/Gfx/EK/Platinegrn.jpg" alt="Platine" title="Platine, wie Elektronik eben aussieht." />
    <p class="Bildunterschrift"><a href="#Abb02" title="Anker zu Lesezeichen hinzuf&uuml;gen." onclick="return ATBookmarkApp.addBookmark(this)">Abb. 2:</a> Moderne Elektronik mit beidseitiger Mischbest&uuml;ckung THT/SMT.</p>
    <a name="Abb03" id="Abb03"></a>
    <img src="https://xn--wp-gka.de/Gfx/EK/Platinegrn.jpg" alt="Platine" title="Platine, wie Elektronik eben aussieht." />
    <p class="Bildunterschrift"><a href="#Abb03" title="Anker zu Lesezeichen hinzuf&uuml;gen." onclick="return ATBookmarkApp.addBookmark(this)">Abb. 3:</a> Moderne Elektronik mit beidseitiger Mischbest&uuml;ckung THT/SMT.</p>
   </div>
   <h2>Gew&uuml;nschtes Verhalten</h2>
   <p>Ben&ouml;tigt wird ein Querverweis, der in so vielen Navigatoren wie m&ouml;glich funktioniert und ein Lesezeichen <strong>mitsamt</strong> individuellem Zielanker anlegt. Als Bonus soll der auch ein &bdquo;&nbsp;&ndash;&nbsp;<Ankername>&ldquo; an den Seitentitel f&uuml;r den Lesezeichentitel anf&uuml;gen. Der IE hat unter allen Navigatoren die niedrigste Priorit&auml;t. Bitte keine Grundsatzdiskussion vom Zaun brechen!</p>
   <h2>Derzeitiges Verhalten</h2>
   <dl>
    <dt>Opera 12.01 Win</dt><dd>Nach Klick erscheint ein Fensterchen mit dem Angebot, die Seite ins Paneel aufzunehmen. Der Ankername erscheint gar nicht erst oder verschwindet nach dem ersten Anklicken dieses Querverweises sowohl im Titel als auch dem Fensterchen. Im Paneel wird die Seite sowohl in die Lesezeichen eingetragen (erw&uuml;nscht), also auch als Seite in einer neuen Kategorie dargestellt (unerw&uuml;nscht). In den Eigenschaften dieses Paneels ist <em>Als Paneel zeigen</em> standardgem&auml;&szlig; angeschaltet, was nicht sein sollte.</dd>
    <dt>Firefox 14.0.1 Win</dt><dd>Nach Klick erscheint ein Fensterchen mit Angebot, die Seitenadresse als Lesezeichen aufzunehmen. Der Ankername fehlt. Dabei mu&szlig; au&szlig;erdem das Feld <em>Lesezeichen in der Sidebar anzeigen</em> abgestellt werden, da sich die Seite sonst beim Klick auf das Lesezeichen in der Lesezeichenleiste &ouml;ffnet.</dd>
    <dt>Comodo Dragon 21.0 portable Win</dt><dd>Nach Klick erscheint eine Mitteilung, man solle CTRL+D nutzen, um das Lesezeichen anzulegen. Chrome und seine Abk&ouml;mmlinge verhindern meinen Recherchen zufolge das Anlegen von Lesezeichen auf diese Weise. Da diese mit CTRL+D erzeugten aber keine Ankernamen haben, ist der ganze Vorgang hinf&auml;llig.</dd>
   </dl>
   <h2>L&ouml;sung gesucht!</h2>
   <p>Wer kann etwas beitragen, das mich meinem Ziel etwas n&auml;her bringt?</p>
  </div>
 </body>
</html>
Wer weiß Rat? Bei Fragen: fragen! 8) Vielen Dank schonmal vorab!

Gruß - WPö

Re: [Javascript] Querverweis soll Lesezeichen mit Ankernamen

Verfasst: 14.08.2012 16:20
von NicTheQuick
Kann mir das gerade nicht genauer anschauen, aber ich hätte eine andere Frage an dich:
Wieso nutzt du nicht als Encoding UTF-8? Dann kannst du dir so Sachen wie &uuml; nämlich sparen und gleich ü schreiben. :wink:

Re: [Javascript] Querverweis soll Lesez. m. Ankernamen anleg

Verfasst: 14.08.2012 18:09
von WPö
Hallo, Nic!

Die Präsenz ist im Laufe der Jahre gewachsen. Damals, als ich begann, gab es zwar auch schon UTF-8, es war aber noch nicht so ausgereift. Am Umstieg auf UTF-8 hindert mich derzeit noch, daß noch nicht alle Texte vom Stand mit hartkodierten Umlauten umgestellt sind. Ich arbeite ohnehin daran. Das sollte aber kein Thema hier sein.

Gruß - WPö

Re: [Javascript] Querverweis soll Lesezeichen mit Ankernamen

Verfasst: 14.08.2012 18:53
von bobobo
Favoriten ferngesteuert in beliebigen Browsern anzulegen war schon immer Kacke
Erstens gehts nicht gescheit und zweitens wird der User überfahren.

Folgendes getestet mit opera ie und firefox und gurgle (so'n waran habicht nicht)

Nach Anklicken eines Links wird die Strg-D meldung korrekt angezreigt und liefert auch korrekte Ergebnisse

Code: Alles auswählen

<?xml version="1.0" encoding="ISO-8859-15" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">
 <head>
  <meta http-equiv="content-type" content="text/html; charset=ISO-8859-15" />
  <meta http-equiv="content-language" content="de" />
  <meta http-equiv="content-script-type" content="text/javascript" />
  <meta http-equiv="content-style-type" content="text/css" />
  <meta name="robots" content="noindex" />
  <title>Elektronikkurs</title>
  <style type="text/css">
   <!--
   * {font-family: "Times New Roman", Times, serif; font-size: 100.01%; font-weight: normal; text-decoration: none; margin: 0; padding: 0;}
   div#mitte {min-width: 25em; max-width: 45em; margin: 0 auto; padding: 0 1em;}
   h2 {margin: 1em 0; font-size: 1.25em; font-weight: bold;}
   div.rechterRand {width: 11em; margin: 0 0 0.25em 0.5em; float: right;}
   img {width: 100%; margin-top: 0.5em; border-radius: 0.5em;}
   a {font-weight: bold;}
   p.Bildunterschrift {margin-top: 0.5em; font-size: 0.7em; font-weight: bold;}
   dt {font-size: 1.13em; font-weight: bold; margin-top: 0.25em; background-color: #e0ffe0;}
   strong {font-weight: bold;}
   em {font-style: italic;}
   -->
  </style>
  <script type="text/javascript" language="JavaScript1.2">
   <!--
   
function AddToFavorites(title){
document.title=title;
alert('moinmoin, drücken Sie STRG+D um diese Seite zu Ihren Favoriten hinzuzufügen!');
}
  </script>
 </head>
 <body>
  <div id="mitte">
   <div class="rechterRand">
    <a name="Abb01" id="Abb01"></a>
    <img src="https://xn--wp-gka.de/Gfx/EK/Platinegrn.jpg" alt="Platine" title="Platine, wie Elektronik eben aussieht." />
    <p class="Bildunterschrift"><a href="#Abb01" title="Anker zu Lesezeichen hinzuf&uuml;gen."    onclick="AddToFavorites('dies');">Abb. 1:</a> Moderne Elektronik mit beidseitiger Mischbest&uuml;ckung THT/SMT.</p>
    <a name="Abb02" id="Abb02"></a>
    <img src="https://xn--wp-gka.de/Gfx/EK/Platinegrn.jpg" alt="Platine" title="Platine, wie Elektronik eben aussieht." />
    <p class="Bildunterschrift"><a href="#Abb02" title="Anker zu Lesezeichen hinzuf&uuml;gen."    onclick="AddToFavorites('das');">Abb. 2:</a> Moderne Elektronik mit beidseitiger Mischbest&uuml;ckung THT/SMT.</p>
    <a name="Abb03" id="Abb03"></a>
    <img src="https://xn--wp-gka.de/Gfx/EK/Platinegrn.jpg" alt="Platine" title="Platine, wie Elektronik eben aussieht." />
    <p class="Bildunterschrift"><a href="#Abb03" title="Anker zu Lesezeichen hinzuf&uuml;gen."    onclick="AddToFavorites('jenes');">Abb. 3:</a> Moderne Elektronik mit beidseitiger Mischbest&uuml;ckung THT/SMT.</p>
   </div>
   <h2>Gew&uuml;nschtes Verhalten</h2>
   <p>Ben&ouml;tigt wird ein Querverweis, der in so vielen Navigatoren wie m&ouml;glich funktioniert und ein Lesezeichen <strong>mitsamt</strong> individuellem Zielanker anlegt. Als Bonus soll der auch ein &bdquo;&nbsp;&ndash;&nbsp;<Ankername>&ldquo; an den Seitentitel f&uuml;r den Lesezeichentitel anf&uuml;gen. Der IE hat unter allen Navigatoren die niedrigste Priorit&auml;t. Bitte keine Grundsatzdiskussion vom Zaun brechen!</p>
   <h2>Derzeitiges Verhalten</h2>
   <dl>
    <dt>Opera 12.01 Win</dt><dd>Nach Klick erscheint ein Fensterchen mit dem Angebot, die Seite ins Paneel aufzunehmen. Der Ankername erscheint gar nicht erst oder verschwindet nach dem ersten Anklicken dieses Querverweises sowohl im Titel als auch dem Fensterchen. Im Paneel wird die Seite sowohl in die Lesezeichen eingetragen (erw&uuml;nscht), also auch als Seite in einer neuen Kategorie dargestellt (unerw&uuml;nscht). In den Eigenschaften dieses Paneels ist <em>Als Paneel zeigen</em> standardgem&auml;&szlig; angeschaltet, was nicht sein sollte.</dd>
    <dt>Firefox 14.0.1 Win</dt><dd>Nach Klick erscheint ein Fensterchen mit Angebot, die Seitenadresse als Lesezeichen aufzunehmen. Der Ankername fehlt. Dabei mu&szlig; au&szlig;erdem das Feld <em>Lesezeichen in der Sidebar anzeigen</em> abgestellt werden, da sich die Seite sonst beim Klick auf das Lesezeichen in der Lesezeichenleiste &ouml;ffnet.</dd>
    <dt>Comodo Dragon 21.0 portable Win</dt><dd>Nach Klick erscheint eine Mitteilung, man solle CTRL+D nutzen, um das Lesezeichen anzulegen. Chrome und seine Abk&ouml;mmlinge verhindern meinen Recherchen zufolge das Anlegen von Lesezeichen auf diese Weise. Da diese mit CTRL+D erzeugten aber keine Ankernamen haben, ist der ganze Vorgang hinf&auml;llig.</dd>
   </dl>
   <h2>L&ouml;sung gesucht!</h2>
   <p>Wer kann etwas beitragen, das mich meinem Ziel etwas n&auml;her bringt?</p>
  </div>
 </body>
</html>

Re: [Javascript] Querverweis soll Lesezeichen mit Ankernamen

Verfasst: 14.08.2012 19:10
von WPö
Danke, bo³. Leider ist das genau dasjenige, was ich nicht will. Der Ankername muß zwingend im Lesezeichen landen. Alles andere ist nicht zielführend. Die übliche Aktion mit STRG+D hätte ich meinen Besuchern sonst längst angezeigt. Das steht aber auch in meinem Text.

Mit Fernsteuern hat das nicht zwingend etwas zu tun. Selbstverständlich ließe sich die Technologie entsprechend zweckentfremden, daß sämtliche Verweisziele auf meiner supergeilen total angesagten und Mußhabenplattform bei jedem Besucher seine Lesezeichenliste fluten. Wenn Du aber ehrlich und aufmerksam bist, wirst Du darin keine Gefahr bei meiner Präsenz sehen.

Gruß - WPö

Re: [Javascript] Querverweis soll Lesezeichen mit Ankernamen

Verfasst: 14.08.2012 19:52
von bobobo
Ist ja nicht jedermann so anständig wie du. :)

Der Ankername LANDET im Lesezeichen, wenn man den entsprechenden Link vorher anklickt. zumindest laut meinen Tests
mit der überschaubaren Anzahl von Webbrowsern.

Re: [Javascript] Querverweis soll Lesezeichen mit Ankernamen

Verfasst: 14.08.2012 19:58
von WPö
bobobo hat geschrieben:Der Ankername LANDET im Lesezeichen, wenn man den entsprechenden Link vorher anklickt.
Da hast Du allerdings recht. Genau diesen Umweg wollte ich aber gern dem Besucher ersparen. Mir geht es um eine Erleichterung zum Setzen eines Lesezeichens (oder auch nur um die Bekanntgabe des richtigen Ankernamens), ohne diesen direkt für jeden sichtbar zu haben. Erst mit einem Klick soll der Ankername erscheinen, ohne die Seite zu wechseln. Da bleibt ja kaum etwas anderes als JS übrig. Wenn aber schon JS, dann soll auch gleich ein richtiges Lesezeichen angelegt werden, das dann auch den Ankernamen enthält, ohne daß vorher dieser Anker angesprungen sein muß.

Gruß - WPö

Re: [Javascript] Querverweis soll Lesezeichen mit Ankernamen

Verfasst: 14.08.2012 20:38
von NicTheQuick
Das würde aber eine Sicherheitslücke bedeuten und wird deshalb von den heutigen Browsern so wohl nicht mehr unterstützt.

Re: [Javascript] Querverweis soll Lesezeichen mit Ankernamen

Verfasst: 14.08.2012 20:44
von WPö
Eine Sicherheitslücke wäre es dann - und da gebe ich Dir recht - würde der Navigator ohne weitere Nachfrage den Querverweis anlegen. Da aber dieses Fensterchen meines Wissens nach bei jedem Navigator kommt (ist ja auch vernünftig), sollte das kein Argument sein.

Gruß - WPö

Re: [Javascript] Querverweis soll Lesezeichen mit Ankernamen

Verfasst: 15.08.2012 19:09
von bobobo
hab dazu noch was schönes gefunden
Hinweis: Wenn der User es nicht schafft eigenständig ein Bookmark anzulegen, dann wird er es auch kaum wiederfinden - der Einsatz eines Bookmark-Scriptes ist also relativ sinnfrei.