I have this script:
Menu item
I can not edit the html. Only the js. This is my js:
// Click
$('.next-content').click(function() {
var url = $(this).attr('href');
console.log(url);
});
When i click on the a button. I get the variable. The href in the variable. The variable is #extensive. But, how can i remove the # from the variable?
Thanks for help
var url = $(this).attr('href').substring(1);
You can replace the '#' character
url.replace('#','')
or substring
url.substring(1)
Can't you just do
// Click
$('.next-content').click(function() {
var url = $(this).attr('href');
url=url.replace("#","");
console.log(url);
});
You can google it easily...
var url = $(this).attr('href').substr(1);
I'm unsure really.
This may help. I would have said replace would have been your best option:
url.replace('#', '');
Related
I am trying to remove the start of a link in jQuery. I have tried to inject the following function but it doesn't work. What am I doing wrong?
JS
$(function() {
$('link-active').each(function() {
$(this).attr('href').remove('http://www.linkplus.com/xQWE=');
});
});
HTML
<td class="block">
<a class="link-active"
href="http://www.linkplus.com/xQWE=http://www.example.com">Get</a>
</td>
When you're trying to search for classes, make use of dot (.), $('link-active') should be $('.link-active').
About .remove(): this one will remove one element of the DOM; not applicable in this case.
Solution: You will need to use .attr() to return AND update the href attribute of your tag, .replace() method should help.
$(function() {
$('.link-active').each(function() {
let href = $(this).attr('href'); //returns href value
let removableUrl = 'http://www.linkplus.com/xQWE=';
href = href.replace(removableUrl, ''); //replace the url you don't want with ''
$(this).attr('href', href); //update href value
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<td class="block">
<a class="link-active"
href="http://www.linkplus.com/xQWE=http://www.example.com">Get</a>
</td>
Note: There's other methods to separate the url you don't want (if the url stay in the same format), check for:
.substring(): href = href.substring(removableUrl.length);
.split(): href = href.split('=')[1];
.replace() with regex: href = href.replace(/.*\=/,'');
Amend $('link-active') to $('.link-active').
First thing is While representing a class in jQuery try using dot notation..
$(function() {
$('.link-active').each(function() {
$(this).attr('href').remove('http://www.linkplus.com/xQWE=');
});
});
It's convenient to use attr method like this:
$(function() {
$('.link-active').attr('href', function(i, href) {
return href.replace('http://www.linkplus.com/xQWE=', '');
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a class="link-active" href="http://www.linkplus.com/xQWE=http://www.example.com">Get</a>
Change your code on line 3 to
$(this).attr('href', $(this).attr('href').replace('http://www.linkplus.com/xQWE=', ''));
Full code should be
$(function() {
$('link-active').each(function() {
$(this).attr('href', $(this).attr('href').replace('http://www.linkplus.com/xQWE=', ''));
});
});
remove is not being used correctly here, as that method is meant to remove elements from the DOM and accepts a selector string as its argument.
Try something like this instead:
$(function() {
$('.link-active').each(function() {
var href = $(this).attr('href');
var strToReplace = 'http://www.linkplus.com/xQWE=';
$(this).attr('href', href.replace(strToReplace, ""));
});
});
Above we use replace to replace the start of the link with an empty string.
You have to get the string, replace it and then set it again.
Something like this:
$(function() {
$('link-active').each(function() {
replacement = 'http://www.linkplus.com/xQWE=';
url = $(this).attr('href');
$(this).attr('href', url.replace(replacement, ''));
});
});
Thanks in advance for helps
trying to create redirect page for external links
Here , i need to change href with class="external" from the root (recreate it) , not to create click event to open window with customized href
<a class="external" href="http://google.com">GOOGLE</a>
see this
$('a.external').click(function (e) {
e.preventDefault();
var target = e.target || e.srcElement;
if ($(target).attr('target') == "_blank") {
window.open("http://"+redirectpage+"?url=" +$(target).attr('href') , "_blank");
} else {
window.location = "http://"+redirectpage +"?url="+ $(target).attr('href'));
}
})
the above example if you copy the link by right click on
GOOGLE it will copy the original link http:// google .com
But
i want to convert the original link whatever , when i click to open this link OR when i copy it the result =
http://example.com/redirect.html?url=http://google.com/
the redirect page i use http:// example .com/redirect.html
contains this
html
<a id="gotoexternal" href="">go to external</a>
js
<script>
var query = window.location.search.substring(1);
query = query.replace("url=", "");
$('#gotoexternal').attr('href', query);
</script>
You have an extra closing parentheses in your window.location line.
Should be
window.location = "http://"+redirectpage +"?url="+ $(target).attr('href');
$('a.external').each(function () {
$(this).attr( 'href', "http://"+redirectpage +"?url="+ $(this).attr('href') );
$(this).removeAttr( 'target' ); //strip target _blank from links
});
This simply does a one time replacement of the url with the redirection url. It requires no onclick events and no messing with target or anything else. Unless there is some reason that you want to maintain the original url that you haven't mentioned, this should be the most straightforward way to achieve what you want.
You can use attr(attributeName,function) to modify the existing href
$('a.external').attr('href',function(_, oldHref) {
return "http://" + redirectpage + "?url=" + oldHref;
});
the target should be already set according to your code
You can also do this right in a click handler so the user can't see the changes when hovering links
$('a.external').click(function (e) {
this.href = "http://" + redirectpage + "?url=" + this.href;
});
Reference: attr(attributeName,function) Docs
What im trying to do is find all hyperlinks that have a href like this herf="/grade4/chapter1.html"
and replace the chapter word with href="grade4/chapter_af1.html"
i have tried a few jquery tricks but have had no luck
$('a').each( function() {
var $this = $(this);
var href = $this.attr('href').replace(/\chapter/,'chapter_af');
$this.attr('href', href );
});
You don't need a regular expression, just do a normal string replace:
http://jsfiddle.net/9MXSZ/
$('a').each( function() {
var $this = $(this);
var href = $this.attr('href').replace('chapter','chapter_af');
$this.attr('href', href );
});
If you really want to use a regex, the \ in your version is throwing it off:
.replace(/chapter/,'chapter_af')
No need of Regex here.
Try simply like this
var href = $this.attr('href').replace('chapter','chapter_af');
Just change your replace statement to:
...
var href = $(this).attr('href').replace('chapter', 'chapter_af')
...
See it working here: http://jsfiddle.net/vNCpV/
On my website id like to run a jQuery function if my url contains the word 'test'
All im trying to do is if my url contains the 'rest' string then add a margin to an element on the page?
Ive added a jSfiddle to try and show what Ive done so far.
$(document).ready(function(){
// How can I check to see if my url contains the word 'TEST' then run the below function?
$('.block-widget').css('margin-top, 252px')
});
Use window.location to get the current location url..
Based on the condition you can then apply the margin top property.
$(document).ready(function(){
var pathname = window.location.pathname;
if(pathname.indexOf('text') > -1){
$('.block-widget').css('margin-top, 252px');
}
});
$(document).ready(function(){
if (document.url.match(/test/g)){
$('.block-widget').css('margin-top, 252px')
}
});
Take a look at this link that contains details that you need to know about URL.
https://developer.mozilla.org/en-US/docs/DOM/window.location
$(document).ready(function(){
if (window.location.href.indexOf('rest') >= 0) {
$('.block-widget').css('margin-top, 252px')
}
});
Get the path name:
var pathname = window.location.pathname;
Then check if it contains "TEST".
if (pathname.toLowerCase().indexOf("test") >= 0)
try this
$(document).ready(function(){
var patt=/test/g;
if(patt.test(window.location.pathname)){
$('.block-widget').css('margin-top, 252px')
}
});
name*='keyword' selector is true option.
<input name="man-news">
<input name="milkman">
<input name="letterman2">
<input name="newmilk">
<script>
$( "input[name*='man']" ).val( "has man in it!" );
</script>
Resource: https://api.jquery.com/attribute-contains-selector/
I want to capture the text that is in between anchor link tag and pass it to the href value as query string so it looks like http://mysite.com/events/Pages/default.aspx?cat=cancer
The reason I can't add that manually is because the value in between and is dynamic. How do I capture that and append to the url using jquery or javascript??
or i can maybe, at the event of Cancer link being clicked, direct it to http://mysite.com/events/Pages/default.aspx?cat=cancer
Cancer
$("a").on("click", function (e) {
e.preventDefault();
window.location = this.href + $.trim($(this).text());
});
Or you could replace the href attribute for each link:
$("a").prop("href", function () {
return this.href += $.trim($(this).text());
});
Then clicking each link will automatically direct the user correctly. Your selector ($("a") should be more specific, depending on your markup)
Example: http://jsfiddle.net/6U749/
Edit: If you have to do it inline, here's one way:
Cancer
You could do something like this:
$('.someClassImStickingOnLinksThatNeedThisBehavior').each(function()
{
this.href = $.trim(this.href) + $.trim(this.innerHTML);
});
Then, for any link, it would automatically update the HREF to the current HREF plus the value of the node.
You can do:
var yourlink = $("#youlink");
var href = yourlink.attr("href");
var text = yourlink.html();
yourlink.attr("href", href + "?cat=" + text);