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)
Related
Actually it could happen that's the title it's not exactly correct, so sorry.
My problem is the following. I have a variable (what contains html), what it get from ajax response and i would like to add new attribute a few element. And after it insert to the dom.
For example, here this:
ajaxString = "<b>asd</b>";
replaced = $("b", $(ajaxString) ).css('background','#ff0000');
$("body").html(replaced);
But it's doesn't work. I hope, somebody have an idea!
Thanks for the Help!
This can be done using a virtual element:
var ajaxString = "<b>asd</b>",
virtualDiv = $('<div>', {html: ajaxString});
$("b", $(virtualDiv)).css('background', '#ff0000');
$("body").html($("b", $(virtualDiv))[0]);
As per your comment you can use this to get all the html of virtual div:
$("body").html($(virtualDiv).html());
You can create the element in a jQuery object first, then amend its attributes before appending it. Try this:
$("<b>asd</b>").css('background', '#ff0000').appendTo('body');
here is a working fiddle of what you try to achieve
you should use filter
var newhtml = $('<b>asd</b><p>asd</p>');
newhtml.filter('b').each(function(){
$(this).css('font-size','50px')
$(this).css('color','blue')
});
newhtml.filter('p').each(function(){
$(this).css('font-size','20px')
$(this).css('color','red')
});
$('body').html(newhtml);
https://jsfiddle.net/c7a6spaj/
Cheers
I would like to split some content from an "a" html tag. I was starting over with jquery. My code is like this but it is not working:
$("a.uribb").each(function() {
var id = $(this).attr("href").replace("http://dereferer.org/?", "");
$(this).append(+id+);
});
And the HTML tag is this:
<a href="http://dereferer.org/?http://example.com/" target="_blank" class="uribb">
http://example.com/
</a>
I wanted to split out the http://dereferer.org/? part and leave the other there. How could I do this?
Try to use .text() instead of .append() if you want to replace the content. Also, there is no need for the + before and after the id.
You could try this instead:
var id = $(this).attr("href").replace("http://dereferer.org/?", "");
$(this).text(id);
Update
Reading through the question again, I'm not sure if you want to replace the content of the a-tag or the the value of the href. In case of the latter, try this:
var id = $(this).attr("href").replace("http://dereferer.org/?", "");
$(this).attr("href", id);
Notice
Since jQuery 1.6, it is preferred to use .prop() instead of .attr().
How about that?
$("a.uribb").attr("href", function(i, val) {
return val.substring(val.indexOf("?") + 1);
});
DEMO: http://jsfiddle.net/zQdL4/
It's interesting but for your markup the following code should also work :)
$("a.uribb").attr("href", function() {
return $.trim(this.innerHTML);
});
Right, so what you want is this.
<a href="http://example.com/">...
Try this.
$("a.uribb").each(function() {
var indirect_url = $(this).prop("href");
var direct_url = indirect_url.replace("http://dereferer.org/?", "")
$(this).prop('href', direct_url);
});
You could of course do this in fewer lines, but this way it's clear what's going on. Specifically, replace() does not modify the string it operates on.
$("[littleBox]").load("ajax.php?eid="+$(this).attr("littlebox"));
the $(this).attr("little box") portion of the code returns undefined.
I'm trying to get the individual attribute of the initial $("[littleBox]").
this particular line of code is called as the soon as the document is ready.
when I put predefined values, such as
$("[littleBox]").load("ajax.php?eid=1");
It works as expected. Unfortunately, I need it to load specific content based on that element's attribute. Any idea how to make this work?
Loop through all items with proper this:
$("[littleBox]").each(function() {
var $this = $(this)
$this.load("ajax.php?eid="+ $this.attr("littlebox"));
});
this will not refer to $("[littleBox]") in that context, you'll have to repeat the selector - or select the element already and re-use it:
var $box = $("[littleBox]");
$box.load("ajax.php?eid=" + $box.attr("littlebox"));
post yout html that cotnain attr "little box" in it.
is it like
<a attr="little box" id="test">test<a/>
then it work like
$('#test').click(function(){
alert($(this).attr('little box'));
});
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','');