Notifikationer

Markér alle som læst Log ud

netro Nybegynder

01. juni 2006 - 12:41 Der er 16 kommentarer og
1 løsning

createElement - insertBefore

Jeg forsøger at gøre et billede til et link, der befinder sig i en redigerbar div. Det går fint, sålænge der kun ligger ét billede i div'en. Ellers får jeg fejl i den markerede linie?

ObjSelected = event.srcElement;
EditFld = document.getElementById("edit");

A = document.createElement("a");
A.href = "www.dom.com";
A.target = "_blank";
A.innerHTML = ObjSelected.outerHTML;
EditFld.insertBefore(A, ObjSelected); // <--- !!!
ObjSelected.outerHTML = "";

Jeg har tjekket, at "ObjSelected" ikke skulle være null.

Synes godt om

netro Nybegynder

01. juni 2006 - 14:50 #1

EditFld.appendChild(A); virker fint, skulle jeg hilse og sige, men jeg ønsker jo, at elementet skal indsættes på den rette plads.

Synes godt om

olebole Juniormester

01. juni 2006 - 16:35 #2

<ole>

- hvorfor overhovedet rode standardiseret DOM sammen med ustandardiseret DOM og de ustandardiserede inner- og outerHTML properties? Hvad er det, du ønsker som resultat?

/mvh
</bole>

Synes godt om

olebole Juniormester

01. juni 2006 - 16:41 #3

Kan det mon være dette, du prøver:

var A, EditFld, ObjSelected = event.srcElement;
EditFld = document.getElementById("edit");

A = document.createElement("a");
A.setAttribute("href", "www.dom.com");
A.setAttribute("target", "_blank");
A.appendChild( ObjSelected.cloneNode(true) );
EditFld.replaceChild(A, ObjSelected);

Synes godt om

netro Nybegynder

01. juni 2006 - 16:51 #4

ObjSelected er et billede, som er markeret i en contenteditable div. Her vil jeg give mulighed for at gøre dette til et link. Dvs. erstatte <img src="..."> med <a href="..."><img src="..."></a>. Og det skulle jeg gerne kunne gøre gentagne gange, således at et billede, der allerede er klikbart, blot får en ny href-attribut.

Din løsning er noget pænere, men den giver mig samme fejl ved replaceChild. Det eneste, jeg (næsten) kan få til at fungere er at assigne A.innerHTML til ObjSelected.outerHTML.

Synes godt om

olebole Juniormester

01. juni 2006 - 16:58 #5

Så må du lægge et link. Du laver helt afgjort en fejl :)
Prøv dette lille test-dokument:

<script type="text/JavaScript">
function gnu() {
var A, EditFld, ObjSelected;
EditFld = document.getElementById("edit");
ObjSelected = EditFld.getElementsByTagName("img")[0];

A = document.createElement("a");
A.setAttribute("href", "www.dom.com");
A.setAttribute("target", "_blank");
A.appendChild( ObjSelected.cloneNode(true) );
EditFld.replaceChild(A, ObjSelected);
alert(edit.innerHTML)
}
</script>

<button onclick="gnu()">TEST</button>

<div id="edit" style="width:400px;height:300px;border:1px solid red" contentEditable>
<img src="http://www.eksperten.dk/img/elogo.png">
</div>

Synes godt om

netro Nybegynder

01. juni 2006 - 17:00 #6

Det gør jeg utvivlsomt. Jeg ser lige på det.

Synes godt om

netro Nybegynder

01. juni 2006 - 17:10 #7

Dit eksempel virker umiddelbart som mit eksisterende. Hvis jeg klikker mere end en gang på knappen, opstår der en fejl.

Synes godt om

netro Nybegynder

01. juni 2006 - 17:28 #8

Næ, vent lidt. Det så egentlig ud til at løse det oprindelige problem. Det at ændre href'en er så et tillægsspøgsmål vel at mærke. Det ved jeg ikke, om du har lyst til at kommentere?

Synes godt om

olebole Juniormester

02. juni 2006 - 18:05 #9

Det ville jeg gerne, hvis jeg vidste, hvad du vil vide :)

Synes godt om

netro Nybegynder

02. juni 2006 - 22:39 #10

Okay :) så tager jeg udgangspunkt i dit eget eksempel. Jeg markerer et billede (eller trykker på din knap), og billedet fungerer nu som et link. Hvis jeg senere finder ud af, at jeg gerne vil have linket til at pege på en anden adresse og gentager proceduren, så får jeg en fejl. Her er jeg nødt til at slette billedet og tilføje det igen for til sidst at tilføje det nye link. Jeg ville gerne blot kunne overskrive href'en - hvis muligt.

Synes godt om

netro Nybegynder

10. oktober 2006 - 03:13 #11

Jeg fandt aldrig en løsning her, men jeg er nok nødt til at lukke snart.

Synes godt om

jhe-ting Nybegynder

23. oktober 2006 - 09:55 #12

Jeg har fundet en løsning!

Hvis billedet allerede har et link, skal A-elementet bare rettes.
Fejlen opstod når et link forsøgtes placeret inden i et andet link.

<HTML>
<HEAD>
<TITLE>test http://www.eksperten.dk/spm/713149</TITLE>
</HEAD>
<BODY>
<script type="text/JavaScript">
function gnu() {
var A, EditFld, ObjSelected, ObjParent;
EditFld = document.getElementById("edit");
ObjSelected = EditFld.getElementsByTagName("img")[0];

ObjParent = ObjSelected.parentElement;
if (ObjSelected.parentElement.tagName == "A") { // Allerede et link?
ObjParent.setAttribute("href", "www.experten.dk");
ObjParent.setAttribute("target", "_blank");
} else {
A = document.createElement("a");
A.setAttribute("href", "www.dom.com");
A.setAttribute("target", "_blank");
A.appendChild( ObjSelected.cloneNode(true) );
EditFld.replaceChild(A, ObjSelected);
}

alert(edit.innerHTML)
}
</script>

<button onclick="gnu()">TEST</button>

<div id="edit" style="width:400px;height:300px;border:1px solid red" contentEditable>
<img src="http://www.eksperten.dk/img/elogo.png">
</div></BODY>
</HTML>

Synes godt om

jhe-ting Nybegynder

04. november 2006 - 19:24 #13

Hej netro.
Har du prøvet 23/10-2006 09:55:35 ?

Synes godt om

netro Nybegynder

05. november 2006 - 02:18 #14

Jeg har ikke prøvet at implementere det i mit eget projekt, men jeg har prøvet dit eksempel, og det ser jo faktisk ud til at virke fint :) Så jeg siger mange tak og vil gerne give dig points for det.

Synes godt om

jhe-ting Nybegynder

05. november 2006 - 02:35 #15

Håber det lykkes.
Tak for point. ;-)

Synes godt om

olebole Juniormester

06. november 2006 - 08:37 #16

Der er ikke noget (officielt), der hedder 'parentElement' ... brug i stedet den standardiserede 'parentNode':
ObjParent = ObjSelected.parentNode; ;o)

Synes godt om

netro Nybegynder

06. november 2006 - 08:43 #17

Ok.. jeg ser på det. Tak!

Synes godt om

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.

Følg dette spørgsmål

Opret Preview

Webudvikling kurser

Vi tilbyder markedets bedste kurser inden for webudvikling

Se alle Webudvikling kurser

Flere spørgsmål fra JavaScript kategorien

Titel	Indlæg	Oprettet	Seneste aktivitet
problem med download i <a href=" " download> tag i JavaScript Af Peer i JavaScript	5	27/04/202620:09	03/05/202613:59
Validering af filnavn i formular Af Strawberry i JavaScript	8	14/04/202610:11	20/04/202611:14
Mangler et JavaScript til htm side med iframe i Joomla5 Af Peder Lund Nielsen i JavaScript	2	03/02/202614:19	04/04/202616:02
Åbne en PDF fil fra en mappe Af mbl i JavaScript	9	18/04/202516:52	22/04/202512:33
Spørgsmål til cookies Af Mads i JavaScript	2	14/02/202511:47	27/06/202514:34

Se alle spørgsmål i kategorien Opret spørgsmål

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

Alle kategorier på Eksperten

Seneste artiklerRSS