Jump to content

getSelection() equivalent?


retro-starr

Recommended Posts

I was looking up some bookmarklets (awesome use of JavaScript) when I came across 'document.getSelection();', but couldn't find it in w3schools references (I'm not known for finding stuff). I did find it however on Mozilla's developer network, which probably explains why the bookmarklet was labeled 'Netscape/Mozilla". Is there a way to select the highlighted text using the standard library so that it'll work on any browser?

Link to comment
Share on other sites

As usual. IE is the bad boy in this. If I remember right, Mozilla has some cross-browser discussion and maybe even links to MSDN. I believe you will be reading about text-ranges and such. Depending on how much you want, the learning curve is steep there.

Link to comment
Share on other sites

I was looking up some bookmarklets (awesome use of JavaScript) when I came across 'document.getSelection();', but couldn't find it in w3schools references (I'm not known for finding stuff). I did find it however on Mozilla's developer network, which probably explains why the bookmarklet was labeled 'Netscape/Mozilla". Is there a way to select the highlighted text using the standard library so that it'll work on any browser?
if i understood right that will dofunction getSelectedText(textbox){ if (document.selection){ return document.selection.createRange().text; //IE } else { return textbox.value.substring(textbox.selectionStart,textbox.selectionEnd); //firefox,safari,chrome and opera } }
Link to comment
Share on other sites

document.selection is a valid object in IE, not in standards compliant browsers.You don't need to have a comparison operator in an if statement.if (document.selection) will just check to see if that property exists (more specifically, if it evaluates to false). The expression in the parens is evaluated to a boolean value. The following are considered to evaluate to false:- boolean FALSE (obviously :) )- the number 0- an empty string or the string '0'- an empty array (I think)- null- undefinedAnything else evaluates to true.So if document.selection does not exist, it's value will be undefined, which evaluates to false.The comparison operators return a boolean value. So 5==5 returns true, but 5==4 will return false. The if statements don't really use 5==5 they use the return value of 5==5.

Link to comment
Share on other sites

Return simply stops the execution of the current function, and makes it return a certain value to the place where it was called, like:

function f() {return "a";}alert(f());

alerts "a" because f() returned "a".

Link to comment
Share on other sites

Oh, so I was right. So in the script he gave, would I just use getSelectedText() as the variable?

function getSelectedText(textbox) { if (document.selection) { //IE return document.selection.createRange().text;  } else { //firefox, safari, chrome and opera return textbox.value.substring(textbox.selectionStart,textbox.selectionEnd);  };};location.href='http://google.com/#hl=en&q=' + getSelectedText();

Link to comment
Share on other sites

1. There is no variable. You are using the return value of getSelectedText().2. As you can see from the function definition:function getSelectedText(textbox)getSelectedText expects an argument, and your example doesn't provide one.You should note that the Firefox etc. part of abdelelbouhy's function only works if the selected text is in a textarea or text input. If you need text from other elements, a good place to start reading is here: https://developer.mozilla.org/en/window.getSelection

Link to comment
Share on other sites

Oh, so I was right. So in the script he gave, would I just use getSelectedText() as the variable?
function getSelectedText(textbox) { if (document.selection) { //IE return document.selection.createRange().text;  } else { //firefox, safari, chrome and opera return textbox.value.substring(textbox.selectionStart,textbox.selectionEnd);  };};location.href='http://google.com/#hl=en&q=' + getSelectedText();

yes you can use select event to execute the function and here you used the returned value as a query string so you need to pass it to + encodeURIComponent(getSelectedText(textBox))
Link to comment
Share on other sites

I'm not sure how to expand on that. I haven't figured out the return command really.
I had trouble understanding it too, but it is actually quite simple. It is like me stopping what I am doing, and handing you a cookie. You have to decide what you are going to do with it. Alone, it'll do nothing.
function test() {   return "Hello, World!";}test() //does nothingalert(test()) //alerts "Hello, World!"document.write(test()) //outputs "Hello, World!"concat = "blah..." + test() //concatenates "Hello, World!" onto "blah...", and assigns the complete string to the "concat" variable

Link to comment
Share on other sites

I do get your examples, thanks. This little bit of code is a weird to me; I justify the use of return false in this case because the form (#url_bar) is expecting something to comeback, but you're overriding that with return false.

$('#url_bar').submit(function() { address(); return false; });

Did I get it right? I took out the return statement and the script stopped working, but started again when I replaced it.

Link to comment
Share on other sites

I do get your examples, thanks. This little bit of code is a weird to me; I justify the use of return false in this case because the form (#url_bar) is expecting something to comeback, but you're overriding that with return false.
$('#url_bar').submit(function() { address(); return false; });

Did I get it right? I took out the return statement and the script stopped working, but started again when I replaced it.

Well, it really depends on the context of that code. What type of element is #url_bar, for example?return false is usually used to prevent the default action of an element. A simple example would be this:<a href='www.google.com' onclick='alert("This is a message"); return false;'>Click here</a>The above will produce an alert message, but since false is being returned to the click handler** the anchor's default click action, which is to take the user to Google, is prevented from happening.**I think that's where false is being passed, not sure on that, but it isn't important at this point
Link to comment
Share on other sites

This is the code for #url_bar
  <form id="url_bar" method="post">   <!-- way to take off history, so previously typed URLs don't show up? -->   <input id="url_input" type="text" value="" />  </form>

and the action

$('#url_bar').submit(function() { address(); return false; });

So in this case, return false will prevent the form from submitting.
Link to comment
Share on other sites

You can also use return false to stop a script if support for certain methods is non-existent. jQuery aside, here's an example in plain JS:

function firstHeading() {	if ( !document.getElementsByTagName ) return false; //prevent continuation if the "getElementsByTagName" method is unsupported by the user's browser	alert( document.getElementsByTagName('h1')[0] );}

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...