469,275 Members | 1,871 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 469,275 developers. It's quick & easy.

Making a MS jscript ECMA/DOM compliant

Now what I have is a function that only works in WinIE4+ because it's
uses Microsoft proprietary properties and methods:

Expand|Select|Wrap|Line Numbers
  1.  
  2. function gmshortcutkeys() {
  3. if ((parseInt(navigator.appVersion) >= 4) && (navigator.appName ==
  4. "Microsoft Internet Explorer")) {
  5. if (event.ctrlKey != true) return;
  6. gmselection = document.selection.createRange().text;
  7. if (window.event.keyCode == 1) {
  8. gminsertlink = prompt("What do you want to link to?",
  9. "http://")
  10. if (gminsertlink == null) return;
  11. document.selection.createRange().text = '<a href="' +
  12. gminsertlink + '">' + gmselection + '</a>';
  13. return;
  14. }
  15. if (window.event.keyCode == 2) {
  16. document.selection.createRange().text = '<strong>' +
  17. gmselection + '</strong>';
  18. return;
  19. }
  20. if (window.event.keyCode == 3) {
  21. gminsertacrotitle = prompt("How is this acronym spelled out?",
  22. "Start here")
  23. if (gminsertacrotitle == null) return;
  24. document.selection.createRange().text = '<acronym title="' +
  25. gminsertacrotitle + '">' + gmselection + '</acronym>';
  26. return;
  27. }
  28. if (window.event.keyCode == 4) {
  29. gminsertdfntitle = prompt("How is this jargon or technical
  30. term defined?", "Start here")
  31. if (gminsertdfntitle == null) return;
  32. document.selection.createRange().text = '<dfn title="' +
  33. gminsertdfntitle + '">' + gmselection + '</dfn>';
  34. return;
  35. }
  36. if (window.event.keyCode == 5) {
  37. gminsertdelcite = prompt("Point to the page responsible for
  38. this deletion.", "http://")
  39. if (gminsertdelcite == null) return;
  40. document.selection.createRange().text = '<del datetime="' +
  41. document.lastModified + '" cite="' + gminsertdelcite + '">' +
  42. gmselection + '</del>';
  43. return;
  44. }
  45. }
  46. }
  47.  
  48.  
This function HTML tags around selected text in a textarea for a CMS.
It does this in response to keyboard events thus making a simplistic,
through-the-web markup editor for textareas. For example, you select
some text in the textarea, hit a key combo and bang, your select text
is bounded by <strong> tags. Occasionally it may hit the user with a
prompt to fill in a value for the tag attribute.

Kinda quick and nifty huh?

The problem is it only works in Internet Explorer. What I'd like is
some suggestions on how to change this script so that it works in
Mozilla1, Firefox and heck maybe even Opera 7.5 or Safari. I am
completely willing to sacrifice backward compatibility with anything
less than IE6.

I'd like suggestions that bring this function into close compliance
with the W3C's DOM/ECMA rec but if I must use a little proprietary
stuff for it work in the above browsers, I'm okay with that.

Any suggestions?

Jul 23 '05 #1
4 1697


Next Generation Technologies Inc. wrote:

This function HTML tags around selected text in a textarea for a CMS.
It does this in response to keyboard events thus making a simplistic,
through-the-web markup editor for textareas. For example, you select
some text in the textarea, hit a key combo and bang, your select text
is bounded by <strong> tags. Occasionally it may hit the user with a
prompt to fill in a value for the tag attribute. The problem is it only works in Internet Explorer. What I'd like is
some suggestions on how to change this script so that it works in
Mozilla1, Firefox and heck maybe even Opera 7.5 or Safari.


Mozilla (since 1.3) has its own API to manipulate the selection in a
HTML textarea control, see
<http://www.faqts.com/knowledge_base/view.phtml/aid/13562/fid/130>
I think Opera has nothing for that so far. Don't know about Safari.

--

Martin Honnen
http://JavaScript.FAQTs.com/
Jul 23 '05 #2
I don't know about Opera but Mozilla provides:

- 1. the selectionStart and selectionEnd properties on a textarea, plus
the setSelectionRange() method;

- 2. most of the Range portion of W3C's "Document Object Model (DOM)
Level 2 Traversal and Range Specification"
(http://www.w3.org/TR/DOM-Level-2-Traversal-Range), in which, for example,

document.selection.createRange().text
becomes:
window.getSelection().getRangeAt(0).toString()

Don't overlook any simple answers, though: I still find the best way to
add stuff in the middle of a textarea is

var obj = document.forms[0].textarea1;
var str = obj.value;
obj.value = str.substring(0, 5) + "<newtag/>" + str.substring(6);

For events, Mozilla uses the W3C standard
(http://www.w3.org/TR/DOM-Level-2-Events), in which you starting
intercepting events with addEventListener([type], [function], [begin]).
Jul 23 '05 #3
Martin,

Well I'd rather avoid Mozilla's API if it is proprietory. What I want
is a cross-platform, DOM-compliant way to do what the script above
does.

But if I can't have that, I guess I could do a sniff and route the
client to the method that works for their browser.

Jul 23 '05 #4
Paul,
var obj = document.forms[0].textarea1;
var str = obj.value;
obj.value = str.substring(0, 5) + "<newtag/>" + str.substring(6);


I don't quite understand this here. Doesn't this code seem to require
that I already explicitly know the length of the string I want to
bound?

What I want is:

1) To dynamically select a string with my mouse or with the keyboard
2) Hit a key combo and have JavaScript bound the selected string with
the HTML tags associated with that key combo.

Basically the code I cited at that start of this thread is a
simple-minded, non-WYSIWYG, keyboard driven markup editor of sorts that
I use with my blogging tool. I've moved to Firefox and the above code
no longer works.

Jul 23 '05 #5

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

4 posts views Thread by Harag | last post: by
10 posts views Thread by Gernot Frisch | last post: by
10 posts views Thread by Danny | last post: by
28 posts views Thread by Andre | last post: by
10 posts views Thread by the DtTvB | last post: by
4 posts views Thread by Lando | last post: by
1 post views Thread by CARIGAR | last post: by
reply views Thread by suresh191 | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.