I've been thinking/searching for an equivalent of the problem that I am having below, and nothing could be found. Is there a way I can rewrite this to work with jQuery as an alternative?
First half of the code.
<a href="link.php?test=true" onclick="request(this)" target="_blank">
<a id="step2" href="javascript:alert('NOT FINISHED!');">
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>
Whereas I want to do a jQuery var request type thing. I want onclick="request(this)
to work with my jQuery.
I've been thinking/searching for an equivalent of the problem that I am having below, and nothing could be found. Is there a way I can rewrite this to work with jQuery as an alternative?
First half of the code.
<a href="link.php?test=true" onclick="request(this)" target="_blank">
<a id="step2" href="javascript:alert('NOT FINISHED!');">
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>
Whereas I want to do a jQuery var request type thing. I want onclick="request(this)
to work with my jQuery.
- 1 Changing the href is pretty easy, but I have no idea what you are really trying to do. Perhaps an explanation of what you are trying to accomplish would help. Simply changing the href alone seems pretty pointless as an action. – tvanfosson Commented Sep 12, 2009 at 0:06
- I have 5 buttons, and I want it where every time a button is hit, it requests it, so that after the requests are met, it will change the href for "id (about)". Currently the href ="#" allowing them not to proceed, so to say? – homework Commented Sep 12, 2009 at 0:08
4 Answers
Reset to default 10The answer to your question (title) is to replace
document.getElementById('about').href = '#';
with
$('#about').attr('href','#');
I have no idea if this will actually help you solve your problem, though, since I really don't know what you are trying to do. Based on your comments and code sample, it appears that you are trying to do some sort of wizard, but I have no idea how it would actually work given what you've 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>
Like this? I think I'm missing/not understanding something though...
$('#about').click( function(evt) {
request(this);
});
For convenience you can define an additional method on the $ object
$.getElementById = function(id){
return $('#'+id).get(0);
};
you can then just change all of your calls from
document.getElementById
to
$.getElementById
There are tons of caveats with this but it can be useful depending on your situation.
This? Not sure I fully get what you want
function request(element)
{
$(element).doSomething();
return false;
}
invoked by:
onclicked="return request(this);"