CODEWITHSUNDEEP
javascriptjquery
Mark Peach
Mark Peach

Reputation:

Change the value of an existing onclick function

I have a page that is pulling in via an iframe a page of html content from a pre-existing content management system, whose content I can not directly change. I want to use jquery to alter some of the links and button locations dynamically.

For links within the page I was able to change the href attr values of 

<a href="/content.asp">more</a>

from content.asp to content2.asp using

$("a[href^='/content.asp']")
.each(function()   {       this.href = this.href.replace("content.asp",          "content2.asp");   });

But the page pulled in also has form buttons that contains javascript onclick functions e.g. 

<INPUT type="button" value="Add to basket" onClick="document.location='/shopping-basket.asp?mode=add&id_Product=1076';">

I basically want to use jquery to select any such buttons and change the shopping-basket.asp to shopping-basket2.asp

How can I select these buttons/onclick functions and change the location string?

Upvotes: 0

Views: 8771

Answers (5)

Epidemus
Epidemus

Reputation:

Give your button a unique id and then reference it from a javascript script with:

document.getElementById("idOfButton").onClick

Simply set the value to a new text string.

Upvotes: 0

Syd
Syd

Reputation: 1546

Just thought that I would update this answer as I have tried several combination in JQuery 1.4.1

1) onclick= function() - not working

$("input").each(function() {
    $(this).onclick = function() {
        window.location.href= 'http://www.google.com';
        return false;
    }
}

2) $newclick = eval(...) not working

$("input").each(function() {
    $jscript = "window.location.href= 'http://www.google.com'; return false;"
    $newclick = eval("(function(){" + $jscript + "});");
    $(this).onclick = newclick;

}

btw. $newclick is evaluated to be undefined

3) the new answer that works in JQuery 1.4.1

$("input").each(function() {
     $(this).click(function() {
        window.location.href = "http://www.google.com";
        return false;
 });

I searched the JQuery API and there is no onclick documentation. Looks like click() is the way to go. Let me know if I have made any mistake(s).

Cheers

Upvotes: 0

Paolo Bergantino
Paolo Bergantino

Reputation: 488374

Not very proud of this solution, but it works....

var getid = /id_Product=(\d+)/;
$('input[type="button"]').each(function() {
    var onclick = String(this.onclick);
    var id = onclick.match(getid);
    if(id) {
        this.onclick = function() {
            window.location = "/shopping-basket2.asp?mode=add&id_Product=" + id[1];
        };
    }
});

Upvotes: 3

defnull
defnull

Reputation: 4199

http://docs.jquery.com/Selectors/attributeContains#attributevalue

$("input[onClick*='shopping-basket.asp']").each( ... )

Upvotes: 1

Sampson
Sampson

Reputation: 268324

Attributes are changed with the .attr method.

$("a").each(function(){
  $(this).attr("href","content.asp");
});

You should be able to replace hard-coded-onClick text as well. To select those buttons, you can either grab all of them:

$("input.convertMe").each(function(){...});

Or you can add classes to the buttons you are specifically interested in:

<input type="button" class="convertMe"...>

Once you've done either of those two, you simply run through each testing their onClick attribute, and determining if you need to do any changes:

$("input.convertMe").each(function(){
  // Test onClick attr, and replace string.
});

Upvotes: -1

Related Questions