Avatar billede r.a.f. Nybegynder
24. marts 2003 - 16:25 Der er 17 kommentarer og
1 løsning

Hvorfor virker dette ikke???

Jeg benytter en wysiwyg editor (http://www.eksperten.dk/spm/243693) og vil gerne oprette kunne oprette links i den. Jeg vil ikke benytte mig af execCommand(CreateLink), da man ikke kan vælge target for linket.

//funktionen i editoren ser således ud:

  function doLink()
      {
          var left = (screen.availWidth/2) - (293/2);
          var top = (screen.availHeight/2) - (125/2);

                           
document.all.__data.value = 'opretLink';
linkWin = window.open("link.php", 'links', 'scrollbars=0, toolbar=0, statusbar=0, width=293, height=125, left='+left+', top='+top);
    }

// og mit nye vindue (link.php) ser således ud.


<script language="JavaScript">


function sendlink() {
if(opener.document.all.__data.value == 'opretLink')//__data er navnet på et hidden field i iframe
  {
document.all.link.value = link;
opener.iView.document.execCommand('opretLink', false, document.all.link.value);
            opener.iView.focus();
            window.close();
    }
}

function focusIt()
    {
        document.all.link.focus();
    }

</script>
<body onload="focusIt()" topmargin="3" leftmargin="3" bgcolor="#DDDDDD">

<Table border="0" cellpadding="3">
<tr><td>Link</td><td><INPUT TYPE="text" SIZE="20" name="link"></td></tr>
</table>
<input  onClick="sendlink()" type="submit" value="Send »">
Avatar billede mortrr Praktikant
24. marts 2003 - 16:51 #1
Der er ikke nogen kommando der hedder "opretLink".

opener.iView.document.execCommand('CreateLink', false, document.all.link.value);
eller
opener.iView.document.execCommand(DECMD_HYPERLINK, OLECMDEXECOPT_DONTPROMPTUSER, document.all.link.value);
eller
opener.iView.document.execCommand(5016, 2, document.all.link.value);

alt efter hvilken version af "editoren" du bruger.

Men her får du jo alligevel ikke target med.
For at få target med er du nødt til selv at lave en funktion til at oprette et link.
Det kunne fx være ved at oprette en range på den selection der er lavet, og erstatte den med noget nyt html, som indeholder et link.
Det giver så lidt arbejde med at finde ud af om der i forvejen er et link, og hvis ja, at give brugeren mulighed for at ændre på det eksisterende link i stedet for at oprette et nyt.
Avatar billede r.a.f. Nybegynder
24. marts 2003 - 22:58 #2
Tak for svaret.
Det kan godt være, at jeg har skjult det godt men jeg prøvede at lave en funktion som ikke brugte execCommand('CreateLink') - men JavaScript er langt fra min stærke side.

Jeg har forsøgt, bikse lidt med det du skrev og det er nok ikke helt rigtigt, men er jeg på rette spor og hvad gør jeg forkert.

<script language="JavaScript">
function sendlink()
{
mitLink = document.link.createRange();
if(mitLink != "")
    {
    return(mitLink)
    }
if(mitlink)
    {
    document.all.link.value = mitLink;
    opener.iView.focus();
    window.close();
    }
}


function focusIt()
    {
        document.all.link.focus();
    }
</script>

<body onload="focusIt()" topmargin="3" leftmargin="3" bgcolor="#DDDDDD">

<Table border="0" cellpadding="3">
<tr><td>Link</td><td><INPUT TYPE="text" SIZE="20" name="link"></td></tr>
<tr><td>Hvor skal siden åbne</td><td>
<select name="target">
<option value="" selected>Internt link</option>
<option value="_blank">Eksternt link</option>
</select></td></tr>
</table>
<input  onClick="sendlink()" type="submit" value="Send »">
Avatar billede mortrr Praktikant
24. marts 2003 - 23:35 #3
Jeg kan vise dig lidt om hvordan man kigger på indholdet af teksten, så du får en idé om hvad der foregår. Og en (måske) hurtig måde at lave et link.

Koden herunder virker formentligt ikke uden tilpasninger, men kommentarerne fortæller lidt om hvad der sker.
For at bruge det til at ændre/oprette et link, benyttes window.showModalDialog, til at vise et vindue, og samtidig "fryse" scriptet.


var CurHREF="";
var CurTarget="";
    //Følgende skal ind i den funktion du kalder når man klikker "link"
    // Du tager fat i den valgte tekst med:
rnHTML=iView.DOM.selection.createRange();
    /* Du har nu en range, som indeholder fx tekst,
        men den kan bestå af hvad som helst.
        For at finde ud af hvad vi har fat i,
        kigger vi på rnHTML's parentElement: */
if (rnHTML.parentElement) {
  eElem=rnHTML.parentElement();
  if (eElem.tagName=="A") {  // Hov, vi har et a-tag.
    CurHREF=eElem.href;      // Så er der muligvis href og target
    CurTarget=eElem.target;
    LinkWin=window.showModalDialog("makelink.htm"); //Åben dialogen
    if (LinkWin) {  //Hvis den returnerer true, så skift link
      eElem.href=CurHREF; //Eller udskift den med noget andet.
      eElem.target=CurTarget;
    }
  } else {  // Det var ikke et link, så laver vi et om den valgte tekst
    if (rnHTML.htmlText.length>0) {  //Hvis der da var noget tekst
      CurHREF="";
      CurTarget="_self";
      LinkWin=window.showModalDialog("makelink.htm",window);
      if (LinkWin) {
        rnHTML.pasteHTML("<a href='"+CurLink+"' target='"+CurTarget+"'>"+rnHTML.htmlText+"</a>");
      }
    }
  }
}


LinkWin skal indeholde en formular som den du viser, og lidt kode som sender værdierne tilbage og lukker igen.
<script language="JavaScript">
function sendlink()
{  //dialogArguments svarer til window i kaldet til showModalDialog
  // CurLink og CurTarget er variablerne i ovenstående script
  dialogArguments.CurLink=document.link.value;
  dialogArguments.CurTarget=document.target.value;
  returnValue=true;  //lægges tilbage i LinkWin i ovenstående script
  window.close();
}

function closeme() {
  returnValue=false;
  window.close();
}

function focusIt()
    {
        document.all.link.value=dialogArguments.CurLink;
// Der skal også lige være en der henter target.
        document.all.link.focus();
    }
</script>

<body onload="focusIt()" topmargin="3" leftmargin="3" bgcolor="#DDDDDD">

<Table border="0" cellpadding="3">
<tr><td>Link</td><td><INPUT TYPE="text" SIZE="20" name="link"></td></tr>
<tr><td>Hvor skal siden åbne</td><td>
<select name="target">
<option value="" selected>Internt link</option>
<option value="_blank">Eksternt link</option>
</select></td></tr>
</table>
<input  onClick="sendlink()" type="submit" value="Send »">
<input  onClick="closeme()" type="submit" value="Luk">

Der er altsammen skrevet direkte her, så der er ingen garanti for at det virker umiddelbart, men med lidt tilpasning går det nok.
Avatar billede mortrr Praktikant
24. marts 2003 - 23:36 #4
"LinkWin skal indeholde en formular" skulle være "makelink.htm skal indeholde en formular"
Avatar billede r.a.f. Nybegynder
25. marts 2003 - 19:35 #5
Det ser kanon godt ud, men det virker ikke. Jeg får at vide at iView.DOM.selection er null eller ikke et object. Jeg har prøvet at lege lidt med det, men forstår ikke helt hvad jeg skal ændre.
Jeg vil gerne maile siderne til dig så du kan få hele overblikket og måske forklare mig hvorfor.
Avatar billede mortrr Praktikant
25. marts 2003 - 19:37 #6
iView.document.selection
Avatar billede r.a.f. Nybegynder
25. marts 2003 - 20:18 #7
Glæden var stor. Denne gang åbnede det nye vindue og det hele så ganske fint ud. Men i input feltet link stod der undefined. Og hvis jeg forsøger at skrive noget kommer der en dialog frem og siger at 'document.link.value' er null eller ikke et object.
Avatar billede mortrr Praktikant
25. marts 2003 - 20:41 #8
Så er det du skal igang med at lære fejl-søgning ;-)
Jeg sagde jo at det skulle tilpasses.

I focusIt, som kører ved onload står der
dialogArguments.CurLink
Der er ingen CurLink i det dokument den kommer fra.
Tanketorsk fra ham mortrr's side - der er sikkert CurHREF der skal bruges i stedet, da den jo indeholder href'en.

document.link.value - hmm, mon ikke det skal være document.all.link.value?
Og samme med target.
Avatar billede r.a.f. Nybegynder
25. marts 2003 - 22:53 #9
Nu begynder det at ligne noget, men der står stadig undefined ud for link.

Desuden overføres hele stien fra min server til linket eks. <A href="http://www.mit_domæne.dk/bibliotek/bibliotek/www.eksperten.dk" target=_self>Eksperten</A>

Når jeg prøver at redigere et eksisternde link ved at markere det og forsøge igen. Får jeg fejl i dialogArguments.curLink


Men lad mig se om jeg har forstået det nogenlunde rigtigt:


function doLink()
{
                var CurHREF="";
                var CurTarget="";
                    //Følgende skal ind i den funktion du kalder når man klikker "link"
                    // Du tager fat i den valgte tekst med:
                rnHTML=iView.document.selection.createRange();

#iView er ID for mit iframe. document.selection fortæller at det er den markerede tekst som skal gemmes i createRange(), den valgte tekst gemmes i variablen rnHTML.

                    /* Du har nu en range, som indeholder fx tekst,
                    men den kan bestå af hvad som helst.
                For at finde ud af hvad vi har fat i,
                kigger vi på rnHTML's parentElement: */
                if (rnHTML.parentElement) {
                  eElem=rnHTML.parentElement();
                  if (eElem.tagName=="A") {  // Hov, vi har et a-tag.
                  CurHREF=eElem.href;      // Så er der muligvis href og target
                  CurTarget=eElem.target;
                    LinkWin=window.showModalDialog("makelink.htm"); //Åben dialogen

# Jeg tror at det er window.showModalDialog der fortæller hvilket bibliotek jeg står i.

                    if (LinkWin) {  //Hvis den returnerer true, så skift link
                      eElem.href=CurHREF; //Eller udskift den med noget andet.
                      eElem.target=CurTarget;
                    }

# Hvis LinkWin eksisterer ... hvad gør eElem.href?

                  } else {  // Det var ikke et link, så laver vi et om den valgte tekst
                  if (rnHTML.htmlText.length>0) {  //Hvis der da var noget tekst
                    CurHREF="";
                        CurTarget="_self";
                      LinkWin=window.showModalDialog("makelink.htm",window);
                        if (LinkWin) {
                      rnHTML.pasteHTML("<a href='"+CurLink+"' target='"+CurTarget+"'>"+rnHTML.htmlText+"</a>");


# Variablerne samles og den markerede tekst gemmes i rnHTML?
        }
      }
      }
    }
}


Siden makelink.htm


<script language="JavaScript">
function sendlink()
{  //dialogArguments svarer til window i kaldet til showModalDialog
  // CurLink og CurTarget er variablerne i ovenstående script
  dialogArguments.CurLink=document.all.link.value;
  dialogArguments.CurTarget=document.all.target.value;

# dialogArguments.CurLink får værdien fra den document.all.link.value osv.

  returnValue=true;  //lægges tilbage i LinkWin i ovenstående script
  window.close();
}

function closeme() {
  returnValue=false;
  window.close();
}

function focusIt()
    {
        document.all.link.value=dialogArguments.curLink;
                document.all.target.value=dialogArguments.CurTarget;
// Der skal også lige være en der henter target.
        document.all.link.focus();
                document.all.target.focus();

# Hver gang siden loades hentes værdien fra vores variabel curLink og ?skrives i <input type=text name=link>?

    }
</script>


Er jeg helt galt på den? Og hvorfor får jeg de ovenstående fejl?

<body onload="focusIt()" topmargin="3" leftmargin="3" bgcolor="#DDDDDD">

<Table border="0" cellpadding="3">
<tr><td>Link</td><td><INPUT TYPE="text" SIZE="20" name="link"></td></tr>
<tr><td>Hvor skal siden åbne</td><td>
<select name="target">
<option value="" selected>Internt link</option>
<option value="_blank">Eksternt link</option>
</select></td></tr>
</table>
<input  onClick="sendlink()" type="submit" value="Send »">
<input  onClick="closeme()" type="submit" value="Luk">
Avatar billede mortrr Praktikant
25. marts 2003 - 23:25 #10
Først lige en understregning:
I kaldet af showModalDialog bruges window som andet argument. Det betyder at dialogArguments (som andet argument "proppes ind i") vil pege på window - altså det vindue der kalder showModalDialog.
Gennem dialogArguments kan man altså få fat i alle variable i det dokument der har kalde showModalDialog.

Og så til hvorfor du ikke får det til at virke:
Du har "byttet om" på det jeg skrev sidst.
Variablerne i den kaldende side hedder CurHREF og CurTarget.
Det bliver i makelink.htm til dialogArguments.CurHREF og dialogArguments.CurTarget (altså ikke noget med CurLink. Den findes ikke)

Når du laver links (og indsætter billeder) i "editoren" bliver URL'er altid absolutte. Du er nødt til manuelt at ændre dem til relative, inden du gemmer den resulterende html. Det kan gøres ved at man fx finder alle
src="http://domæne.dk/
og ændrer det til
src="/
Samme med href
Avatar billede r.a.f. Nybegynder
31. marts 2003 - 19:08 #11
Jeg har nu fået det til at virke sådan nogenlunde. Jeg måtte fjerne de to variabler i starten:

  var CurHREF="";
  var CurTarget="";
  //Følgende skal ind i den funktion du kalder når man klikker "link"

Så nu virker det bortset fra når jeg forsøger, at ændre det link jeg har oprettet. Så får jeg en fejl dialog der siger at dialog.Arguments.curHREF er null eller ikke et object.

Kan man godt ændre curHREF til en relativ sti (jvf. ovenstående) inden man sætter den ind i editoren?
Avatar billede mortrr Praktikant
31. marts 2003 - 21:11 #12
Den hedder
dialogArguments.CurHREF
Altså uden punktum, og med stort C (jscript er case-sensitiv med variabelnavne, i modsætning til vbscript der er ligeglad)

Jeg forstår ikke rigtigt hvorfor du var nødt til at fjerne de to linier med var CurHREF og CurTarget. De kan absolut ikke give nogen fejl.

Du kan godt lave CurHREF om til en relativ sti, inden du lægger den ind i editoren.
Jeg ville nok foretrække noget lignende:
CurHREF=dialogArguments.CurHREF;
AbsLink="http://"+document.domain;
if (CurHREF.indexOf(AbsLink)==0) {
  CurHREF=CurHREF.substr(AbsLink.length);
}
document.all.link.value=CurHREF;
Avatar billede r.a.f. Nybegynder
01. april 2003 - 17:12 #13
Jeg var vist lidt hurtig i vendingen da jeg skrev det for jeg kan se at jeg ikke selv havde punktum med.

Hvad angår de to linier med CurHREF og CurTarget, så gav de ikke nogen desiderede fejl, men url og target blev ikke overført så længe de stod der.

Jeg har forsøgt at sætte linierne ind som skulle gøre stien relativ, men stien er stadig absolut i linket.
Jeg har prøvet at sætte den ind lidt forskellige steder. (i makelink.htm)
Jeg går ud fra at det skal sættes ind i funktionen focusIt() og at linien:

document.all.link.value=dialogArguments.CurHREF;

skal fjernes.
Avatar billede mortrr Praktikant
01. april 2003 - 20:55 #14
Den skal erstattes af fx
CurHREF=dialogArguments.CurHREF;
AbsLink="http://"+document.domain;
if (CurHREF.indexOf(AbsLink)==0) {
  CurHREF=CurHREF.substr(AbsLink.length);
}
document.all.link.value=CurHREF;

Hvis DEN kode ellers virker ;-)

Prøv at sætte et par alerts ind i koden.
Det er altid en god måde at finde ud af hvad der sker:

CurHREF=dialogArguments.CurHREF;
alert(CurHREF);
AbsLink="http://"+document.domain;
if (CurHREF.indexOf(AbsLink)==0) {
  CurHREF=CurHREF.substr(AbsLink.length);
}
alert(CurHREF);
document.all.link.value=CurHREF;
Avatar billede r.a.f. Nybegynder
03. april 2003 - 21:56 #15
Jeg har forsøgt at sætte koden med alerts'ene ind. Når alert boksene kommer op er de tomme/blanke.

Jeg har også forsøgt at indsætte et par alert bokse i den kode som er i editoren for at se hvad variablerne hed når de kom tilbage. Det ser i mine øjen rigtig nok ud.
Når jeg ser på CurHREF står der www.domæne.dk i alert boksen som der skal, men når jeg ser på det link som er blevet sat ind i editoren står der:

http://www.mit_domæne.dk/dir/dir/www.domæne.dk og ikke www.domæne.dk

Meget mærkeligt...

Jeg har også forsøgt at ændre CurHREF når den kom tilbage til editoren med

sluthref = CurHREF.replace(document.domain, "http://", ""); //sådan tror jeg den skal se ud

men det gav samme resultat.

Hvad går der galt??? er det pasteHTML der laver ballade eller hvad???
Avatar billede mortrr Praktikant
03. april 2003 - 22:40 #16
Når du laver et link bliver det relativt, hvis der ikke står en protokol.
Så når du laver et link til www.domæne.dk, vil det blive til et "dokument" på din server - altså http://www.mit_domæne.dk/dir/dir/www.domæne.dk

Hvis du vil have den til at linke til www.domæne.dk, skal du indsætte det som http://www.domæne.dk

replace i jscript virker ikke på samme måde som i vbscript, så du kan ikke bare skrive
sluthref = CurHREF.replace(document.domain, "http://", "");
replace forventer et regular expression. Det var derfor jeg foreslog substr metoden.

Hvis alert ikke viser nogen værdi, så kig på den inden linkwin.
                if (eElem.tagName=="A") {  // Hov, vi har et a-tag.
                  CurHREF=eElem.href;      // Så er der muligvis href og target
                  CurTarget=eElem.target;
alert(CurHREF);
                    LinkWin=window.showModalDialog("makelink.htm"); //Åben dialogen
Avatar billede r.a.f. Nybegynder
07. april 2003 - 14:12 #17
Jubii nu virker det.

Jeg fandt fejlen, så du må lige ligge et svar så du kan få nogle point.

Hvis jeg vil lave noget lignene med indsættelse af billeder kan jeg vel tage udgangspunkt i noget af det samme.

Vil iView.document.selection.createRange()huske curser-positionen i mit iframe?
Eller er det kun tekst som er markerede som huskes?
Avatar billede mortrr Praktikant
07. april 2003 - 15:02 #18
Billeder: Ja - det kan du sagtens.
Der er bare lidt flere ting du bør give adgang til at redigere.
Selvfølgelig src, men også width, height, alt, border osv.

selection.createRange opretter en range udfra den aktive selection.
Men heldigvis er det også en selection hvis man bare sætter cursoren ind et sted. Så jo - det vil den.
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