PDA

View Full Version : use js call itself as a string within a function



jonas-e
03-08-2009, 09:17 AM
I need the js call itself as a string within a function ..

Something like this:


<div id="myElement" >
<a href="javascript:myFunction('foo','bar','myElement');otherFunction('fiddle');randomFunction()">this&raquo;
</a></div>

myFunction (arg1,arg2,element) {
document.getElementById(element).display="none";
// I wish to create a new
// button/link element which calls
// exactly the same js as the link above did, i.e.:
// "javascript:myFunction('foo','bar','myElement');otherFunction('fiddle');randomFunction()"
}


Of course, in different elements, there might any random js calling myFunction().

Any suggestions?

jonas-e
03-08-2009, 10:01 AM
Quite often when you ask a question, you come up with the answer yourself ..:



<a id="tjek" href="javascript:alert(thisLink('tjek'));moveElement('wrap','200px','100px','0px','0px')">move&raquo;
</a>

function thisLink(e) {
var myE=document.getElementById(e);
return myE.href;
}

I would of course be nice if I could reference to the current node without inventing an id for it ..

Twey
03-08-2009, 11:57 AM
Link it.

<a href="javascript: alert(this.href);
moveElement('wrap', '200px', '100px', '0', '0');">
moveĽ
</a>

However, this is a fairly peculiar thing to be doing. I suspect there's a better way, but I can't really tell you without more knowledge of what you're attempting.

jscheuer1
03-08-2009, 12:03 PM
First of all:



href="javascript:

is not such a hot idea. In IE 6, probably other IE versions like 7 and even 8, using that construct tells the browser that when the link is clicked, it is supposed to begin the onunload process of the page. This will stop the animation of animated .gif images, halt processing in some javascript and Flash. Not anything you generally want to have happen. This isn't what usually happens in most other browsers, but it isn't contrary to the standards, so others may adopt it or already exhibit it.

With that in mind, have a look at this demo:


<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="text/javascript">
function func(id){
id = document.getElementById(id);
id.onclick.apply(id);
}
</script>
</head>
<body>
<div>
<a href="#" id="testlink" onclick="alert(this.firstChild.nodeValue);return false;">Test Link</a><br>
<input type="button" onclick="func('testlink');" value="Go!">
</div></body>
</html>

jonas-e
03-09-2009, 06:10 PM
Twey:
Thanks, I tried this.href - it returns "undefined".

I figured out a different way of doing things - but basically, I wanted to create a href/button that would toggle the element it was nested inside - hence the link would no longer exist. So I wanted to take all the javascript from that href and move it to another one - and thus be able to toggle it forth and back between two elements.

jscheuer1:
Thanks for the tip about the onclick attribute - I didn't know about that one. Makes life a lot easier as I can put that on to e.g. a div tag - thus I don't have to wrap an <a href> around it ..!

Never mind about the IE support - it was just a mock-up to show my colleagues an idea of mine about a new UI:
http://lookfeel.ellehauge.net/
- works fine in proper browsers like Firefox, Chrome and Safari :)

Twey
03-09-2009, 06:34 PM
Twey:
Thanks, I tried this.href - it returns "undefined".Not as I used it, it won't. Inside another function, should you call it normally from the handler, this will be window, and therefore this.href will be undefined. The usual approach would be to pass the element in as an argument:
function foo(el) {
alert(el.href);
}

...

<a href="#" onclick="foo(this);">Foo</a>... but you could also pass it as the context of the new function call:
function foo() {
alert(this.href);
}

...

<a href="#" onclick="foo.call(this);">Foo</a>
Oh, yes, I forgot you were using javascript: URIs instead of proper event handlers. One more reason not to. :)

jonas-e
03-12-2009, 09:40 AM
Thanks, I will try that out at some point :)

Forgive me for asking weird questions - as I am not a developer, I do [EDIT TYPO: NOT] know how to structure code. I just try the best I can ..

I dont' get your comment:

Edit: Oh, yes, I forgot you were using javascript: URIs instead of proper event handlers. One more reason not to.

:confused:

Twey
03-12-2009, 12:27 PM
A javascript: URI is executed in the global scope, but an event handler is executed in its own scope with the element as context and a special event object available to give you more information about the event.

jonas-e
03-12-2009, 02:18 PM
Thanks a bundle, I think I understand now.

Please note significant corrected typo in my post above.