How to call a function from a string using variables as parameters?

Hi.

I´d like to know..

How could I call a function using variables as parameters from within a string?

I´ve tried this:



"<h2 id='header_"+this.id+"' style='line-height:28px;'><a href='javascript:void(0)' onclick='Blog.getPost("+this.id+","+Blog._currentBlog+");return false;' style='text-decoration:none;' title='Link para post-"+this.id+"'>"+this.header+"</a></h2>";

But it doesn´t work.

Thanks.

 

Could you provide more code? Are you using document.write on that? Why are you stating CSS inside it? Why are you attaching onclick manually and not building that via the DOM? Why are you even building a H2 from Javascript for that matter? Could we see the object that's inside of since without it we don't know if all your 'this' properties even exist inside the scope properly? If the anchor isn't even going to anything, why the devil even have it be an anchor?!? (of course having it only work via Javascript means the underlying system is an accessibility wreck too)

Basically, your code poses more questions -- and raises a few warning flags.

 

That code is to use inside innerHTML.

I´m using a variable.. "blogHTML".

So..

Blog.prototype.toHTML = function(){

var blogHTML = "";

blogHTML = "<h2 id='header_"+this.id+"' style='line-height:28px;'><a href='javascript:void(0)' onclick='Blog.getPost("+this.id+","+Blog._currentBlog+");return false;' style='text-decoration:none;' title='Link para post-"+this.id+"'>"+this.header+"</a></h2>";

document.getElementById("page").innerHTML = blogHTML;

}


I´m using to develop a blog.

 

Ok, looks like you are building content and/or loading content with javascript, so you're pissing away any accessibility, AND you are going about it via a method that forces a 'reflow' which can make the page feel painful/slow on rendering.

IF there's a legitimate reason to be doing what you are (I doubt there is since that's inaccessible trash) you should be working from the DOM -- it's a bit more code, but it runs faster/cleaner. Document.write and InnerHTML are both flawed in how they work on modern browsers. Likewise there doesn't seem to be a legitimate reason for that to be an anchor, since it's likely filling the H2 and you aren't using the HREF for anything (in fact you're making it do nothing, which is why it's accessibility trash).

Done using the DOM it would likely go something like this:

Blog.prototype.toHTML = function() {
	var newH2 = document.createElement('h2');
	newH2.id = 'header_'+this.id;
	newH2.title = 'Link para post'+this.id;
	newH2.getPostTarget = this.id+','+Blog._currentBlog;
	newH2.onclick = function(e) {
		e = e | window.event;
		var target = e.target || e.srcElement;
		Blog.getPost(target.getPostTarget);
		if (e.preventDefault) e.preventDefault();
		e.returnValue=false;
		return false;
	};
	var p = getElementById('page');
	while (p.firstChild) p.removeChild(p.firstChild);
	p.appendChild(newH2);
}

Code (markup):

The parts you are inlining as 'style' attributes having no malfing business in markup, generated or otherwise, that's the EXTERNAL stylesheet's job (making life easier should you decide to reskin).

Though again it REALLY looks like you are using javascript to do something that has ZERO BUSINESS being done client side, and are pretty much destroying anything remotely resembling usability/accessibility in the process... unless this is like some form of preview pane for an editor or something -- then I could see it... maybe.

 

Hi. I didn´t know about the problem of innerHTML.

I was trying innerHTML, because there is more than just two tags in it.
I thought there was no problem.

I´ll try via DOM.

About the href and onclick:

That was the way I thought was the right way of calling a function in javascript.

Thank you.

 

TECHNICALLY the 'on___' methods in HTML can be applied to any element, though to be frank IMHO they should have been deprecated from HTML for 4 Strict as redundant to using scripting properly -- since just as presentation has no business in the markup the same should at least be attempted as much as possible with scripting. Ideally scripting should be hooking existing markup transparently enhancing how it works, NOT supplanting that functionality and NOT inlined manually via the various on___ attributes.

It's a common misconception about having to put onclick on an anchor -- it can go on any element as it's a 'common attribute'. It's also why I ALWAYS suggest getting a firm command of EVERY aspect of HTML and CSS before you even THINK about doing anything in javascript. Even the old WDG reference for HTML 4
http://htmlhelp.com/reference/html40/

Can open your eyes on a few things -- like the common attributes.
http://htmlhelp.com/reference/html40/attrs.html

Common attributes can go on any rendering tag (pretty much anything inside BODY, or BODY), and you'll notice all the scripting hooks are at the bottom. Take the time to go through that old reference as it takes what the specification TRIES to say in legalese, and turns it into plain English -- which is why some decade and a half later I still point at it as the best source for understanding what the tags are for and what you can do with each of them.

There are lots of mistakes like "I need an anchor with a void href for a script hook" people make all the time -- see how some folks think you HAVE to have a DIV or that idiotic NAV tag around a UL that's a menu (when UL is a perfectly good block-level container unto itself), or how they think <div></div> qualifies as an empty element (it isn't, ever). In that way HTML is far far simpler than most people seem to want to make it... and why it's kind-of sad how people seem to dive for scripting to do things that are either CSS' job, HTML's job, or manipulates HTML in a manner that pisses away accessibility.

Because to be frank for 99% of websites if your page doesn't work javascript off, you better have some DAMNED good content because otherwise it's accessibility rubbish. MAKE the page work without javascript, THEN enhance that functionality with scripting.