JQuery :: Replace Part Of All The Links On A Page?
Jul 12, 2010
I tried finding a similar situation in the forums, but was unable to discover anything sepcific. I think I may be way off here, and or trying to do something bizarre, but what I am trying to do is change only part of the the url for all of the links on a page. So say I want to change:
href="/something/something/all"
to
href="/something/something/specific"
I think I need to use each() in combination with attr but I am not exactly sure how. This is what I have so far (with no luck):
I've successfully changed part of a single link based of it's enclosing div id, but if there is more than one link in the div, it replaces the entire href of all the other links in that div to be the same as the first one. So that's why I think I need to use each(). But again, I'm not sure how to do this properly in this case.
I am using a Jquery/PHP/MySQL login script which is supposed to display an error or success message when the user enters their username/password and also if the username/pw is successfull go to a secure page. Right now as I have it coded, this isn't working properly. Basically nothing is displayed either way.Also,wasn't sure if I just needed to replace, the ?secure-page part with the file name of the page I want to go to if successful?Here is the code as I have it now.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html>[code].....
i was using $.ajax method to get my ajax page on my main page,which is working great.But now if i have links in that ajax page then i can't open them in that same div,the links are opening in new window,but i want to open in same part,i tried google it and then found, i have to use iframe instead of div.how to do with only use jquery and div.
I am trying to make a generic function called whenever the window size changes. I want this function to apply to several different images. The idea is that when the window is resized the function will only change the end of the source code by replacing "_small", "_medium", "_large" with the appropriate size depending on the window. The problem is that when I use the code below it makes ALL of the images the same. The variable imageRightIdStr genereates a list of ids of all of the images that I would like this function to affect. ex: #imageRight101,#imageRight201,#imageRight202,#imageRight203,#imageRight301 etc.
Here is the code that I have now. It mostly works except it makes all of my "imageRight_" images the same. var contentwidth = $('#background').width(); if ((contentwidth) < '1175') { var logo= $('#pageLogo'); var rightImage = $('.rightImage'); logo.attr('src',logo.attr('src').replace('_large','_small')); logo.attr('src',logo.attr('src').replace('_medium','_small')); $(imageRightIdStr).attr('src',$(imageRightIdStr).attr('src').replace('_large','_small')); $(imageRightIdStr).attr('src',$(imageRightIdStr).attr('src').replace('_medium','_small')); }else if ((contentwidth) < '1440' && (contentwidth) > '1175') { var logo= $('#pageLogo'); var rightImage = $('.rightImage'); logo.attr('src',logo.attr('src').replace('_large','_medium')); logo.attr('src',logo.attr('src').replace('_small','_medium')); $(imageRightIdStr).attr('src',$(imageRightIdStr).attr('src').replace('_large','_medium')); $(imageRightIdStr).attr('src',$(imageRightIdStr).attr('src').replace('_small','_medium')); }
this will match any instance of a number following a letter/[a-z][0-9]/gmiso thatvar str="abc123 456";alert(str.replace(/[a-z][0-9]/gmi,''));would return "ab23 456".
how would i replace just the number? so as to get back "abc23 456" - or ideally "abc 456" ?
when i load page it does nothing only blank page, may have code in wrong place but not sure so can someone show me a working example so i can find out what i'm doing wrong also i would like the part of page to refresh evey 120 seconds is this possibe with jquery?
I am trying to incorporate two javascript files (using jQuery) and they are creating a conflict.If the main js is on the page part of the page does not work. If I do not include it my menu and some related features do not work correctly.One code is long so here is the link to it: *I removed Link* (this is the main code for the menu etc)The other js is:
I've got an iframe on my page that displays my affiliate's webpages (located on their domain).
Two concerns: First, all links within the iframe reveal their domain name in the status bar and in the page source, i.e. <a href="affiliate.com/buy.htm">.
Second, the links in the iframe have target="_blank" which opens new tabs/windows, also exposing their domain to my customers.
Would it be possible to replace all instances of "affiliate.com" inside the iframe to "mysite.com"; whereas, "mysite.com" will be a proxy forwarding requests to "affiliate.com"? Keep in mind that these elements do not have ID or Class.
i have 2 pages one is the main and the other is the sub-main
main,html :
<A href="sub-main.html#post5>go and load just post 5</a>
sub-main.html :
<DIV class=posttop id="post4"> here you can write anything ;)
[Code]....
as shown up the code will first load everything in the sub-main.html page then after Finnish loading will reference to the specific post "post5" and selected of highlighted but if the numbers of the post lets say 20 posts inside the sub-main.html it's will take to load forever . what i want to is when i click the link in main.html to go to the post5 in the other page how can i load just the div element of the "post5" and the rest give the user the option to load it if he wish to see the whole posts
but I need to do a beforeSend callback, to fade out the current content, wait until it is fully hidden, and only then fade in with the received ajax request. But doing this, for example, with .ajaxSend, the content loads much quicker, then fadeOut is complete.
I am currently programming Script Adds data to the database but if i want to Shown the data that have been added Requires refresh the page to show the Data that have been added . and I do not want this method.I want to when adding data to show updates as soon as the addition of data.This can be done by Ajax , and An example of this method used Google Gmail.
I want to develop a multi-tab browser plugin, which requires all links in a page could open in new tabs within this multi-tab browser plugin. It's very similar to Multi-Tab functions of Firefox/IE, when opening a page in one tab, then any links in that Tab will open in another new tab(after setup from pref), i want to know this principle(how to implement this). I am thinking try this:$('a').click(...), while i am not sure whether it's good/enough.
How do you print part of an html page using the javascript print() function? Is it possible to put the printable area inside a <div></div> block and print it, or can you use a hidden style then print it?
Is there a site on the www which has some information?
I'm trying to write a widget for Mac OSX Tiger. Here's the problem: The user enters a search term which is sent to a perl script on a remote server. This script returns a fully formatted HTML page. I only want part of that page to be displayed. How do I go about doing this?
Does anyone know if I can save part of a web page to a file on the users computer without saving the whole web page? I know I can print part of a web page using style sheets, will this work for saving also?
If not possible, can I use Javascript to program a button the end user can click to save data to a file on their computer?
I currently have a link that links to a different part of the same page using <a href="#title"> which is defined using <a name="#title">. It all works fine but when clicked it adds #title to the end of the URL and when the user clicks the back button it goes back to when they clicked the link rather than actually going back a page which is very inconvenient for my site.
I have seen that on Facebook this has been done so I know there is a way, I just don't know how or what exactly to search on Google.
We are offering a coupon for a free soft drink to everyone who fills out our survey. When the user hits the Submit button at the end of the survey, a page appears with the coupon and a Print button. Currently, the whole page prints, including headings and links. I would like to print only the coupon. This is made trickier by the fact that the coupon is customized for each person with the person's name and the date.
I need to replace all the input tag of a page with a <p> tag with inside the input value. I tried in this way var inputs = jQuery('input'); jQuery(inputs).each(function() { var val = jQuery(this).val(); console.debug(val); jQuery(this).append("<p>"+val+"</p>"); jQuery(this).remove(); }); The problem is that the <p> tag is appended inside the <input> and when I remove it I remove also the <p> just added.
I asked about this a while ago, and got a great answer and a reference to http://www.javascripttoolbox.com/bestpractices/new.php. I just need to override onclick and return false. No biggie!
However, I discovered that my code worked fine in IE (no # in URL after click), but not in FF (# appears in URL after click). Can anyone tell me why?
I am using an ajax call to generate a new image with some text across it. How can I "replace" the image in the current page with the one I just generated, they will have the same name.
