Member Avatar for Altairzq

Hello I'm using this code I got from an example:

<head>
<TITLE>Creating a link</TITLE> 
<SCRIPT LANGUAGE="JavaScript"> 
<!--
function createLink() 
{ 
	var szURL = prompt("Enter a URL:", "http://");
	if ((szURL != null) && (szURL != "")) {
		document.execCommand("CreateLink",false,szURL);
	}
}
// --> 
</SCRIPT>
</HEAD> 
<BODY> 
<H1>Creating a link</H1> 
Here's some text. Select some and click the button to turn it into a hyperlink. 
<BR /> 
<BUTTON ONCLICK="createLink()">Click to create the link</BUTTON> 
</body>
</html>

It's working ok in IE, but in Firefox (3.5.3 I'm using), I get the following error:

uncaught exception: [Exception... "Component returned failure code: 0x80004005 (NS_ERROR_FAILURE) [nsIDOMNSHTMLDocument.execCommand]" nsresult: "0x80004005 (NS_ERROR_FAILURE)" location: "JS frame :: [url]http://localhost/america/editora/simple2.html[/url] :: createLink :: line 11" data: no]

Line 0

I have googled for this error but seems nobody is having problems with it? Any help much appreciated, I'm a rookie in javascript.

(line 11 is the CreateLink line)

  • 2 Contributors
  • 3 Replies
  • 2K Views
  • 1 Day Discussion Span
  • Latest Post Latest Post by Troy III

Dani AI

Generated

the Firefox exception is because createLink only works on a selection inside an editable context. IE historically let some commands slide, but Firefox expects the selection to be in contenteditable content or the document to be in designMode="on". That is why your call to document.execCommand("createLink", ...) fails on a normal page. See Document.execCommand() and the contenteditable attribute. (developer.mozilla.org)
If you prefer to toggle the entire editing surface (e.g., an iframe), use document.designMode. (developer.mozilla.org)

Minimal fix using an editable region, with a safe fallback that wraps the selection if execCommand is not available:

<div id="editor" contenteditable="true">
  Select some text here and press the button.
</div>
<button id="linkBtn">Make link</button>
<script>
document.getElementById('linkBtn').addEventListener('click', () => {
  const sel = window.getSelection();
  if (!sel.rangeCount || sel.getRangeAt(0).collapsed) return alert('Select text first.');
  const url = prompt('Enter a URL:', 'http://');
  if (!url) return;

  if (document.queryCommandSupported && document.queryCommandSupported('createLink')) {
    document.execCommand('createLink', false, url);
  } else {
    const range = sel.getRangeAt(0);
    const a = document.createElement('a'); a.href = url;
    try { range.surroundContents(a); }
    catch {
      const frag = range.extractContents();
      a.appendChild(frag);
      range.insertNode(a);
    }
  }
});
</script>

@Troy_III is right that you need an editable surface; once you add that, createLink works in Firefox. Note: execCommand is now deprecated; for new code, prefer the Range-based approach above. (developer.mozilla.org)

Recommended Answers

All 3 Replies

Member Avatar for Troy III

Hello I'm using this code I got from an example:

<head>
<TITLE>Creating a link</TITLE> 
<SCRIPT LANGUAGE="JavaScript"> 
<!--
function createLink() 
{ 
	var szURL = prompt("Enter a URL:", "http://");
	if ((szURL != null) && (szURL != "")) {
		document.execCommand("CreateLink",false,szURL);
	}
}
// --> 
</SCRIPT>
</HEAD> 
<BODY> 
<H1>Creating a link</H1> 
Here's some text. Select some and click the button to turn it into a hyperlink. 
<BR /> 
<BUTTON ONCLICK="createLink()">Click to create the link</BUTTON> 
</body>
</html>

It's working ok in IE, but in Firefox (3.5.3 I'm using), I get the following error:

I have googled for this error but seems nobody is having problems with it? Any help much appreciated, I'm a rookie in javascript.

(line 11 is the CreateLink line)

That's because firefox is not capable of executing this or any other commands associated with document.exec !

Member Avatar for Altairzq

Hmm but document.execCommand with "bold", 'underline' and 'italics' work in FF.

Anyway... if you could point me in the right direction as to how to create a link in FF I'd appreciate. Just a hint will be enough :)

commented: this is for talking nonsense - but moreover for never saying a smple "thanks". +0
Member Avatar for Troy III

Hmm but document.execCommand with "bold", 'underline' and 'italics' work in FF.

Anyway... if you could point me in the right direction as to how to create a link in FF I'd appreciate. Just a hint will be enough :)

For as far as I know it doesn't,
where did you see that? :')
[in firefox it's only possible in recently adopted 1997 IE technology "contentEditable" mode turned On, not in normal view mode. ]

No, I can't point you to any direction or give you a hint or anything of that sort

But what I can do, is to give you my original code that will also work in FX right?
:')

(FX, Opera and IE tested, -please test it in other browsers and report any eventual problems you might find).

Here is the code:

<html>
<head>
<title>Text to Hyperlink</title> 
</head> 
<body> 
<h1>Create a link</h1> 
Select some text and click the button. The selected text will become the named hyperlink<br>
My Homepage<br>
My Favorite<br>
My Search Page<br><br>
<button onclick="createLink(event)">Make it a link</button> 
<script>
function createLink(e){//b.b. Troy III p.a.e.
 if(e.target){ //get ATL
	var a = window.getSelection().getRangeAt(0);
	var b = a.toString();  
	var z = document.createElement("span");
	var l2 = prompt("Enter URL:", "http://");
		b = b.link(l2);
		z.innerHTML=b;
		a.deleteContents();
		a.insertNode(z) }
 else{ //get the ATW
        document.execCommand("CreateLink") }
}
</script>
</body>
</html>

Note: to shorten the ATL method and gain some efficiency, I've used some widely compatible DOM0,1 methods.

Regards

Edited by Troy III because: n/a
Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.