Avatar billede NielsErikP Mester
10. januar 2012 - 01:11 Der er 5 kommentarer og
1 løsning

Hvordan får man "BbCodeEditor" til at virke..??

Hej...
Har læst en Guide med en BbCodeEditor her på eksperten.dk...!

Men hvordan får man den til at virke.. som link i fsvorit linjen har jeg filen BbCodeEdit.html, som ser sådan ud  :


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
        "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
    <title>
        Ekspertens BB- Code Editor
    </title>
</head>

<body>
    <p>   
        <a href='java script:o=document.createElement("script");o.type="text/javascript";o.src="http://localhost/expbbedit.js";document.body.appendChild(o);void(0)'>ExpBBEdit</a>
    </p>
</body>
</html>



Og js filen "expbbedit.js" som ser sådan ud :


(function(){
// ExpBBEdit 1.2 
// Hvis vi er på en spørgsmålsside   
var elmTxt = document.getElementById("newreplytext"); 
// Hvis vi er på en guideside
if (!elmTxt) elmTxt = document.getElementById("text"); 
// Hvis vi er på en internpostside   
if (!elmTxt) elmTxt = document.getElementsByName("message")[0]; 
// Hvis vi er på en Opret Spørgsmålsside
if (!elmTxt) elmTxt = document.getElementById("newquestiontext"); 
// Hvis vi er på en anden side, stopper festen her!
if (!elmTxt) return;
var aBtns = [
            ["B", "Bold (Ctrl+B)", "b"],
            ["I", "Italic (Ctrl+I)", "i"],
            ["@", "@UserName: (Ctrl+A)", "@"],
            ["BOX", "Blue Box (Ctrl+D)", "div"],
            ["PRE", "Preform/Monosp\nText (Ctrl+M)", "pre"],
            ["URL", "URL (Ctrl+U)", "url"],
            ["FNT", "Font (Ctrl+F)", "font"],
            ["SIZ", "Font Size (Ctrl+S)", "size"],
            ["COL", "Color/Hue (Ctrl+H)", "color"]
            ];
var oCSS = {
    bar:{
            height: "28px",
            background: "#cbcbcb",
            cursor: "default"       
        },
        btn: {
            cssFloat: "left",
            float: "left",
            width: "35px",
            height: "16px",
            marginLeft: "5px",
            paddingTop: "5px",
            border: "1px solid #999",
            borderBottomColor: "#888",
            background: "#01bce0 url('/images/button_w86.gif') no-repeat center center",
            color: "#fff",
            font: "bold 11px arial, sans-serif",
            textAlign: "center"   
        }
    };
    function insertButton(elmPar, aOpts) {
        var elmBtn = document.createElement("div"),  css = elmBtn.style;
        elmPar.appendChild(elmBtn);
        elmBtn.appendChild(document.createTextNode(aOpts[0]));
        elmBtn.setAttribute("title", aOpts[1]);
        for (x in oCSS.btn)
            css[x] = oCSS.btn[x];       
            if (aOpts[0].length<3)
                css.width = "24px";
            if (elmBtn.addEventListener) elmBtn.addEventListener("mousedown", function(){ExpBBEdit.format(aOpts[2])}, false);
            else if (elmBtn.attachEvent) elmBtn.attachEvent("onmousedown", function(){ExpBBEdit.format(aOpts[2])});
    };
    function insertBar() {
        var elmBar = document.createElement("div"),        css = elmBar.style, x;
        for (x in oCSS.bar) css[x] = oCSS.bar[x];
        elmTxt.parentNode.insertBefore(elmBar, elmTxt);
        return elmBar;
    };
    var elmBar = insertBar();
    for (var i=0,j=aBtns.length; i<j; i++)
        insertButton(elmBar, aBtns[ i]);
        elmTxt.focus();
/*******************************************************************************/
    function format(sTag) {
        var bAT = false;
        if (sTag=="@") {
            sTag = "b";
            bAT = true;
        }
        var val = elmTxt.value, nS = elmTxt.selectionStart,        nE = elmTxt.selectionEnd;
            if (val.charAt(nE-1)==" ") nE--;
            var a = val.substr(0, nS),        b = val.substring(nS, nE),        c = val.substring(nE),        sSTag = (bAT ? "@" : "") + "[" + sTag + ((/font|color|url|size/.test(sTag)) ? "=]" : "]"),        sETag = "[/" + sTag + "]" + (bAT ? ":" : ""),        nSLen = sSTag.length,        nELen = sETag.length, n;
            elmTxt.value = a + sSTag + b + sETag + c;
        if (nE-nS<1) {
            n = sSTag.indexOf("=")<0 ? nS+nSLen : nS+nSLen-1;
            elmTxt.selectionStart = n;
            elmTxt.selectionEnd = n;
        } else {
            n = sSTag.indexOf("=")<0 ? nE+nSLen+nELen : nS+nSLen-1;
            elmTxt.selectionStart = n;
            elmTxt.selectionEnd = n;
        }
        setTimeout("ExpBBEdit.focus()", 1);
    };
    function formatFromKey(e) {
        e = e ? e : event;
        if (!e.ctrlKey) return;
        switch (e.keyCode) {
                case 65: format("@"); break
                case 66: format("b"); break
                case 68: format("div"); break
                case 70: format("font"); break
                case 72: format("color"); break
                case 73: format("i"); break
                case 77: format("pre"); break
                case 83: format("size"); break
                case 85: format("url"); break
                default: return;
        }
        if (e.stopPropagation) e.stopPropagation();
        if (e.preventDefault) e.preventDefault();
            e.cancelBubble = true;
            e.returnValue = false;
    };
    function doFocus() {
            elmTxt.focus();
    };
    window.ExpBBEdit = {
          "format": format,
          "formatFromKey": formatFromKey,
          "focus": doFocus    };
          if (elmTxt.addEventListener)
              elmTxt.addEventListener("keydown", ExpBBEdit.formatFromKey, false);
          else if (elmTxt.attachEvent)
                    elmTxt.attachEvent("onkeydown", ExpBBEdit.formatFromKey, false);
})();




Når jeg trykker på linket i favorit linjen, får jeg bare windows vente icon, som bliver ved med at køre..

Hvad gør jeg lige galt her, siden det ikke virker??

Håber der er en der kan hjælpe!
Avatar billede olebole Juniormester
10. januar 2012 - 15:55 #1
<ole>

Begynd med at slette den favorit, du allerede har lavet  =)

Derefter sørger du for at JS-filen ligger i roden af din lokale server. Du skriver såvidt jeg husker PHP, så du har sikkert en lokal Apache server (en WAMP el.lign.).

Så kaster du HTML-filen, du viser i den første blå boks ovenfor, i en browser. Højreklik på linket i browseren og vælg 'Føj til Favoritter', eller hvad det nu hedder i din standardbrowser.

Du vil få en sikkerhedsadvarsel. Klik 'OK' - scriptet er ikke farligt.

Gem f.eks. din favorit i Favoritlinjen (lige under adresselinjen), så den altid er let tilgængelig.

Nu skulle der gerne komme en editorbar til syne, når du står på en E-side med et textarea og klikker på favoritten.

/mvh
</bole>
Avatar billede NielsErikP Mester
10. januar 2012 - 22:44 #2
Hej...
Det var lige det der manglede..@Ole...
Smider du lige et svar ??
Avatar billede olebole Juniormester
11. januar 2012 - 15:28 #3
Ellers tak, jeg samler ikke point. Læg et svar selv og accepter det, så tråden lukkes  =)
Avatar billede NielsErikP Mester
11. januar 2012 - 21:04 #4
Hej...
Jamen det lyder smukt :-) Og tak for hjælpen!
Avatar billede olebole Juniormester
11. januar 2012 - 21:08 #5
Selvtak. Jeg håber, du får glæde af den  =)
Avatar billede NielsErikP Mester
11. januar 2012 - 21:18 #6
Hej...
Den er simpelthen genial fundet på...Kredit til dig :-)
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester