having trouble with javascript

[aneeb]

Hey Everyone! i am writing a javascript for a button, when the button is pressed it gets the product id from url and add that product into the cart. The button is working fine but the problem is when i am pressing the button the screen hangs and a flash screen appears which is loading continously. I have also applied css in it for button.here is the javascript which i have written..

 $('#detailsPage').live('pageshow', function(event) {var id = getUrlVars()["id"];var serviceURL = "http://localhost:8080/mano2/services/";$.getJSON(serviceURL + 'getmagento1.php?id='+id, displayPromotion);});var  prodid ;function getUrlVars() {	var vars = {};	var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value) {		vars[key] = value;	});	return vars;}function displayPromotion(data) {	var promodetails = data.item;console.log(promodetails);$('#promopic').attr('src', 'media/catalog/product/' + promodetails.small_image);$('#code').text(promodetails.name + ' ' + promodetails.name);$('#details').text(promodetails.price);$('#address').html('<a id="bttn" href="http://localhost:8080/magento/index.php/checkout/cart/add?product=' + promodetails.entity_id + '&qty;=1" >add to cart</a>');$('#bttn').css({"width":"130px","height":"50px","padding":"0","display":"block","text-align":"center","text-decoration":"none","line-height":"48px","font-family": "'Tienne', sans-serif","font-size":"20px","font-weight":"bold","color":"black","margin":"10px auto","-moz-border-radius":"5px","-webkit-border-radius":"5px","border-radius":"5px","border-width":"2px","border-style":"solid","border-color":"#ccc #333 #777","background-color": "black7", /* Old browsers */"background-color":"-moz-linear-gradient(top, #878787 6%, #3d3d3d 49%, #000000 50%, #000000 100%)", /* FF3.6+ */"background-color": "-webkit-gradient(linear, left top, left bottom, color-stop(6%,#878787), color-stop(49%,#3d3d3d), color-stop(50%,#000000), color-stop(100%,#000000))", /* Chrome,Safari4+ */"background":" -webkit-linear-gradient(top, #878787 6%,#3d3d3d 49%,#000000 50%,#000000 100%)", /* Chrome10+,Safari5.1+ */"background": "-o-linear-gradient(top, #878787 6%,#3d3d3d 49%,#000000 50%,#000000 100%)", /* Opera11.10+ */"background":" -ms-linear-gradient(top, #878787 6%,#3d3d3d 49%,#000000 50%,#000000 100%)", /* IE10+ */"filter": "progid:DXImageTransform.Microsoft.gradient( startColorstr='#878787', endColorstr='#000000',GradientType=0 )", /* IE6-9 */"background": "linear-gradient(top, #878787 6%,#3d3d3d 49%,#000000 50%,#000000 100%)", /* W3C */},{"hover":{"background": "#878787", /* Old browsers */"background": "-moz-linear-gradient(top, #878787 6%, #3d3d3d 19%, #000000 21%, #000000 100%)",/* FF3.6+ */"background":" -webkit-gradient(linear, left top, left bottom, color-stop(6%,#878787), color-stop(19%,#3d3d3d), color-stop(21%,#000000), color-stop(100%,#000000))", /* Chrome,Safari4+ */"background": "-webkit-linear-gradient(top, #878787 6%,#3d3d3d 19%,#000000 21%,#000000 100%)", /* Chrome10+,Safari5.1+ */"background":" -o-linear-gradient(top, #878787 6%,#3d3d3d 19%,#000000 21%,#000000 100%)", /* Opera11.10+ */"background": "-ms-linear-gradient(top, #878787 6%,#3d3d3d 19%,#000000 21%,#000000 100%)", /* IE10+ */"filter": "progid:DXImageTransform.Microsoft.gradient( startColorstr='#878787', endColorstr='#000000',GradientType=0 )", /* IE6-9 */"background": "linear-gradient(top, #878787 6%,#3d3d3d 19%,#000000 21%,#000000 100%)" /* W3C */}});console.log(promodetails.name);$('#actionList').append('<li><h3>Dates</h3>' +'<p>This promotion starts from  ' + promodetails.name + '</p><p> And will end at '+promodetails.price+'</p></li>');$('a#bttn').bind("click", function(event) {event.preventDefault();var url = $(this).attr("href");	alert("Now I want to call this page: " + url);$.ajax({  type: "GET",  url:url,  success: function() {	alert("Product added to cart");  }});});$('#actionList').listview('refresh');}function getUrlVars() {	var vars = [], hash;	var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');	for(var i = 0; i < hashes.length; i++)	{		hash = hashes[i].split('=');		vars.push(hash[0]);		vars[hash[0]] = hash[1];	}	return vars;}

Please help me i am new to this...

[justsomeguy]

You define the getUrlVars function twice. That's not the reason that the page would hang though. To figure that out, you should figure out the point in the code that causes it to hang. You can do that by adding alerts throughout the code, before and after each action takes place. Each time an alert shows the Javascript will pause until you press the OK button, so you can use the alerts to pause the code and step through it to figure out which part causes it to hang. Once you know which part is responsible then we can figure out why.