Convert "document.getElementById" to jQuery

Question

I thought / searched for the equivalent of the problem that I have and nothing was found. Is there a way to rewrite this to work with jQuery as an alternative?

The first half of the code.

<a href="link.php?test=true" onclick="request(this)" target="_blank"> <a id="step2" href="javascript:alert('NOT FINISHED!');"> 

The second half of the code.

 <script language="javascript"> var requests = 16; function request(self) {if(self.href != "#") requests -= 1; self.childNodes[0].src = "images/clear.gif"; if(requests === 0) document.getElementById("step2").href = "next.php";} </script> 

While I want to make a jQuery var query type object. I want onclick="request(this) work with my jQuery.

Answer 1

The answer to your question (name) is to replace

 document.getElementById('about').href = '#'; 

from

 $('#about').attr('href','#'); 

I have no idea if this will really help you solve your problem, since I really don't know what you are trying to do. Based on your comments and code samples, it seems like you're trying to make some kind of wizard, but I have no idea how this actually works considering what you posted.

Update:

Maybe something like:

 <a href="link.php?test=true" onclick="request(this)" target="_blank" class='request'></a> <a id="step2" href="next.php">Step 2</a> <script language="javascript"> $(function() { var requests = 16; $('#step2').click( function() { alert('Not finished'); return false; }); $('.request').click( function() { var $this = $(this); // save jQuery reference to element clicked // swap indicator image source $this.find('img:first').attr('src','images/clear.gif'); // if the number of flipped indicators equals the number of requests // remove the click handler from the step 2 link // this removes the alert and allows the user to proceed if ($('.request img[src="images/clear.gif"]').length == requests) { $('#step2').unbind('click'); } ...do something with the href for this request via ajax??? // replace this handler with one that simply returns false // and remove the href since we're done with this request $(this).unbind('click').attr('href','#').click( function() { return false; } ); // stop the default action for the request return false; }); </script> 

Answer 2

Like this? I think I am missing / do not understand something, though ...

 $('#about').click( function(evt) { request(this); }); 

Answer 3

For convenience, you can define an additional method for the $ object

 $.getElementById = function(id){ return $('#'+id).get(0); }; 

you can just change all your calls with

 document.getElementById 

to

 $.getElementById 

There are many caveats, but this may be useful depending on your situation.

Answer 4

It? Not sure if I totally get what you want.

 function request(element) { $(element).doSomething(); return false; } 

called:

 onclicked="return request(this);"