I have some dynamically created links in my pages and what I need to do is when I click on the link, I should pass the name of the link to another page. So, please show me a way to accomplish this. Thanx in advance :)
If you are using jquery, you can use :
<html>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
foo bar
<script>
$('a').click(function () { alert($(this).text()); /* attr('href') */ });
</script>
</html>
Of course the html an so are not good, but the click thing is what you need.
Then you could use ajax, or a parameter in the target URL to give the link to the other page.
But why don't you generate that when creating links?
I mean add a href="mylink?from=mylink".
Edit: corrected with your comment. What you need is text() rather than attr('href').
document.getElementById('anchor').innerHTML;
then you can pass this value as a parameter, to another page.
documetn.getElementById("mylink").setAttribute("href", "newlink");
documetn.getElementById("mylink").InnerHTML = "new link name";
var link = document.getElementById('link');
link.setAttribute("href", link.getAttribute("href") + "?linkName=" + encodeURI(link.innerHTML));
This will make your link be something like this:
<a id="link" href="http://somewebsite.com?linkName=Name_of_the_link">Name_of_the_link</a>
Then on the "other" page you can access the link name through the GET variable linkName.
Related
JavaScript novice, thanks in advance.
I'd like to get the the full string of query parameters and append them all to a link in the body. The link in the body will send the user to a registration website so I'd need those query strings to carry over to the next site. I'm thinking this would be the best way to do it, if not, please advise.
Example: http://example.com?utm_source=Twitter&utm_medium=HostedEvent&utm_campaign=Event2015
I'd like go grab ?utm_source=Twitter&utm_medium=HostedEvent&utm_campaign=Event2015 and add it to a link in the body
Link: Register
Assuming the link in the html link does not have other parameters and that you add a class to it so we can target it
Register
Then you need the following script
$(function(){
var urlparams = window.location.search;
$('.copy-url-params').prop('href', function(idx, current){
return current + urlparams;
});
});
How can I use jQuery to get a string of text from the onclick attribute and set it as the href attribute.
Here's the fiddle I'm working with: http://jsfiddle.net/MBmt5/
I want to take only TrackPackage.asp?track=95213&ship=OTHER&ShippingMethod=3 from the onclick attribute and prop it to an href attribute
So that it would end up looking like this: http://jsfiddle.net/52Nha/
Unfortunately, I have no idea how to accomplish this. Can anybody help me? Must be compatible with jQuery 1.4.2. Thanks.
Update
Of course I'd begin with:
$(document).ready(function(){
$('span.trackpackagebutton').closest('a').removeAttr('href');
});
Ugly but I hope this will help you.
$('a').attr('href',
$('a')[0].getAttribute('onclick')
.replace("window.open('", '').split(',')[0].replace("'", ''))
.removeAttr('onclick');
Working demo - http://jsfiddle.net/MBmt5/5/
Note: Based on your markup structure you can use the right selector and reuse the above code.
E.g: The below code will execute this logic for all the anchors on the page which have onclick attribute which has window.open.
$('a[onclick^="window.open"]').each(function(){
$(this).attr('href',
this.getAttribute('onclick')
.replace("window.open('", '').split(',')[0].replace("'", ''))
.removeAttr('onclick');
});
Here's one way:
http://jsfiddle.net/MBmt5/2/
http://jsfiddle.net/GaZGv/1
var $a = $('span.trackpackagebutton').closest('a');
var href = $a.attr('onclick').split('(')[1].split(',')[0].replace(/'/g, '');
$a.attr('href', href).removeAttr('onclick');
alert(href)
I have a .button made in css and added to the html 4 times like this
<a class="button icon Call" id="nupp2" href="#"><span>CALL</span></a>
and a .js with the following inside
$(document).ready(function(){
$("nupp2").click(function(){
var name=prompt("Please enter your name","blabla");
});
});
The buttons appear if I open the html with firefox and they change if I hover over them
But if I press the button, it doesn't do anything. I didn't forget to point to the files in the html file.
Am I even doing this right? Or is jquery more complex than I think?
Selectors in jQuery work a lot like the ones in CSS. $("nupp2") becomes $("#nupp2"), see?
This is wrong:
$("nupp2").click(function(){
The correct is:
$("#nupp2").click(function(){
The string inside the parens is a jQuery selector. Since you want to select an element by id, the proper selector is a hash sign followed by the id.
you need to add a hash sign (#) before the ID of the element - $('#npp')
You missed the hash on your selector:
$("#nupp2").click(function(){ // <----- #nupp2
var name=prompt("Please enter your name","blabla");
});
To call an ID you need to add a # in front of the selector (Like CSS)
So your jQuery selector should be $("#nupp2")
Just try this
$(document).ready(function(){
$("#nupp2").click(function(){
var name=prompt("Please enter your name","blabla");
});
Try this:
$(document).ready(function(){
$(a#nupp).click(function(){
var name=prompt("Please enter your name","blabla");
});
});
I want to change the following example URL
http://www.mydomain.net/site?argument1=test1&argument2=test2#anchor
to
http://www.mydomain.net/site?argument1=test1&argument2=test2
with JavaScript. How would I best do that?
EDIT: With 'anchor' and the other text elements, I meant generic elements. So the anchor could also be another text. Sorry.
If you're trying to change the current location's anchor, it's better to change window.location.hash:
window.location.hash = '';
In some browsers this will avoid a reload of the page as the URL changes.
Try this:
window.location = window.location.replace(/#anchor/,"");
OK, so I tried this, and it worked perfectly fine:
var url=window.location.toString();
url=url.replace(/#anchor/,'');
window.location=url;
This should replace #anchor but also #anchor_etc or #anchor-etc from your url
var url = "http://www.mydomain.net/site?argument1=test1&argument2=test2#anchor";
url = url.replace(/\#[a-z\-\_]+/i, '');
window.location = window.location.replace('#anchor','');
I've created a javascript function that will take a hidden span, copy the text within that span and insert it into a single textarea tag on a website. I've written a function in JavaScript that does this (well, kinda, only after a few clicks), but I know there's a better way - any thoughts? The behavior is similar to a Retweet for twitter, but using sections of a post on a blog instead. Oh, and I'm also calling out to jquery in the header.
<script type="text/javascript">
function repost_submit(postID) {
$("#repost-" + postID).click(function(){
$("#cat_post_box").empty();
var str = $("span#repost_msg-" + postID).text();
$("#cat_post_box").text(str);
});
}
</script>
Based on the comment in your question, I am assuming you have something like this in your HTML:
copy post
And I am also assuming that because you are passing a post ID there can be more than one per page.
Part of the beauty of jQuery is that you can do really cool stuff to sets of elements without having to use inline Javascript events. These are considered a bad practice nowadays, as it is best to separate Javascript from your presentation code.
The proper way, then, would be to do something like this:
<a href="#" id='copy-5' class='copy_link'>copy post</a>
And then you can have many more that look similar:
<a href="#" id='copy-5' class='copy_link'>copy post</a>
<a href="#" id='copy-6' class='copy_link'>copy post</a>
<a href="#" id='copy-7' class='copy_link'>copy post</a>
Finally, you can write code with jQuery to do something like this:
$(function() { // wait for the DOM to be ready
$('a.copy_link').click(function() { // whenever a copy link is clicked...
var id = this.id.split('-').pop(); // get the id of the post
var str = $('#repost_msg-' + id); // span not required, since it is an ID lookup
$('#cat_post_box').val(str); // empty not required, and val() is the proper way to change the value of an input element (even textareas)
return false;
});
});
This is the best way to do it even if there is only one post in the page. Part of the problem with your code is that on the first click it BINDS the function, and in the subsequent clicks is when it finally gets called. You could go for a quick and dirty fix by changing that around to just be in document.ready.
$("#repost-" + postID).click(function(){
$("#cat_post_box").val(''); // Instead of empty() - because empty remove all children from a element.
$("#cat_post_box").text($("#repost_msg-" + postID).text());//span isn't required because you have and id. so the selector is as efficient as it can be.
});
And wrap everything in a $(document).ready(function(){ /Insert the code here/ }) so that it will bind to $("#repost-" + postID) button or link when the DOM is loaded.
I had a problem with Paolo's example when I clicked on the link the text that appeared in #cat_post_box was "object Object". Once I added ".text()" to the end of that statement I worked.
var str = $('#repost_msg-' + id).text();
Thanks for you example Paolo!