I am writing an asp.net c# webforms website
I am trying to write some jquery to achieve the following:
When the below link is clicked
<a title="Relevance" href="www.url.com/search/1/3/5/1/4/0">my link</a>
I would like to have some jquery that takes the href and replaces the last number in this case 0 altho we can change the 0 for any replacable string it this makes it easier. with the value of an once this has been done we would like to then redirect the user to the new URL.
Is this easily achievable in jquery? Can any one point me in the direction of a tutorial to ac开发者_高级运维hieve anything similar to this?
Yes, you can do something like this (not checked for accuracy, but the algorithm should be sound):
$('#myLink').click(function()
{
var currentUrl = this.href;
var items = currentUrl.split('/');
items[items.length - 1] = 'myNewValue';
window.location.href = items.join('/');
});
Effectively, split by the slash, then replace the last element, rejoin the string together, and set the window's href to your new location.
If you can change the trailing 0 to any replaceable string, can you also change it to String.Empty
? That way, instead some kind of search-and-replace you can just append a value onto the URL, which is much simpler.
So you'd start with:
<a class="search-link" title="Relevance" href="www.url.com/search/1/3/5/1/4/">my link</a>
And kind of like what Tejs said but simpler:
$('a.search-link').click(function()
{
var currentUrl = this.href;
currentUrl += 'myNewValue';
window.location.href = currentUrl;
});
You can always do this: http://jsfiddle.net/9Kvfh/
$(function()
{
$('.replaceLastNumber').each(function()
{
$(this).click(function(ev)
{
ev.preventDefault();
var ahref = $(this).attr('href');
var Length = ahref.length;
if (ahref.slice(Length - 1, Length) == '/') //Remove trailing slash
ahref = ahref.slice(0, Length - 2);
else
ahref = ahref.slice(0, Length - 1);
ahref += "SomeNewValue";
window.location.href = ahref;
});
});
});
I feel like it could be done better a different way (this system has many failure points, from you changing your php code, to them having js off).
A fairly simple method would be to find the final slash, trim its value and replace it with what you want:
html:
<a title="Relevance" id="link1" href="http://www.url.com/search/1/3/5/1/4/0">my link</a>
jQuery:
$('#link1').click(function(){
// get the url
var url = this.href;
// get the length of the final slash value
var finalSlashLength = url.substring(url.lastIndexOf('/') + 1).length;
// trim the final value off
var newUrl = url.substring(0, url.length - finalSlashLength);
// add the new value
newUrl += 'some new value';
// redirect to the new URL
window.location.href = newUrl;
});
Working sample:
http://jsfiddle.net/QRpYC/2/
EDIT:
Since you mention in the comments the markup is generated dynamically - you can easily find the links based on other options. The first thing I'd look for is do they sit in a common container, such as a div, etc? Look for the parent with a name, class or ID attribute and use this as a selector.
For example if the markup is like this:
<div id="searchLinks">
<a title="Relevance" href="http://www.url.com/search/1/3/5/1/4/0">my link</a>
<a title="SomeLink" href="http://www.url.com/search/1/3/5/1/4/1">my link</a>
</div>
Then you can select them using:
$('div#searchLinks > a').click(function(){....});
精彩评论