JavaScript - Logging Javascript Usage
I'm interested to see how many of our users have JavaScript enabled. My idea is to set a cookie using JS and read it back on a subsequent page load via PHP, log this in a database or flatfile and get an idea of how many users are using JS, and correlate that with their browser version. Of course we have AWStats that we can refer to, but it doesn't give an idea of what percentage of users have JS enabled.
Comments? Ideas? Has anyone done this successfully and what was the result? Similar TutorialsI have an online HTML/JS application that sometimes has erratic behavior. Of course, it never happens to me, and rarely happens in general, but of course when someone DOES report it, it continues to be a problem for them (still completely unpredictable) and of course it's invariably someone far away where I have no access to their machine and they are never very computer literate (I can't ask them to install firebug, for example). The application is an online quiz where the user gets questions in a random order. They answer question, it sends answer to server and gets next question. Sometimes when they select an answer, it just freezes. What I'd like to do is implement some logging where if the user is flagged to log, it captures some logging information and sends it back to the server. Ideally, it wouldn't open a window or anything, the user won't even know it's there. Has anybody seen anything like this? Any pointers? Thanks. Hi, I have a simple page and a javascript that measure the time the user has spent on a page and I want that variable to pass as a link to another page (php). I'm stuck (rookie) with how to actually pass that on in the link. Here's my code: Code: <?php session_start();?> <html> <head> <script type="text/javascript"> /* This script and many more are available free online at The JavaScript Source :: http://javascript.internet.com Created by: Cody Shaffer :: http://codytheking313.byethost11.com */ var time=1; function timeHere() { time = time + 1; finalTime = time / 10; } </script> </head> <body> <div id="container"> <form id="form1" method="post" action=""> <label>Fill this Data <input type="text" name="1" id="1" /> </label> <p> <label> <input type="submit" name="2" id="2" value="Submit" /> </label> </p> </form> <a href="go/index.html">ads</a> </div> </body> </html> Thanks for the help Hi I am in the middle of building some API's for my site and have built a cernal for all API's to read but i dont want the user to add two script tags to their sites code so I was wondering how I could do this. These are not my real files but will give you the full view of what it is I am trying to do. - cernal.js Code: var error = function(o) { if(o !== '') { alert(o); } }; - pub109283746374.js Code: // include the cernal.js file here somehow // Do a small function that uses the error cernal function function ShowNotice() { if(API_KEY !== '' && API_KEY !== undefined) { alert('Success'); } else { error('Sorry but you have an invalid API key.'); } } - http://www.userswebsite.com/demoFile.html Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>WHOISearch API Demo</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script type="text/javascript" src="http://www.mysite.com/API/pub109283746374.js"></script> </head> <body> <script type="text/javascript"> //<![CDATA[ ShowNotice(); // Alerts 'Sorry but you have an invalid API key.' //]]> </script> <script type="text/javascript"> //<![CDATA[ API_KEY = 'pub109283746374'; ShowNotice(); // Alerts 'Success' //]]> </script> </body> </html> If anyone can help me it will help me so much with finishing these API's, please reply if you know how I can do this, Thank You. DJCMBear I am using firefox 8. Is there a way is seeing the details of its memory usage please? Many thanks for any help, S Code: function themeOne() { var thm = document.querySelectorAll("div.articles"); for( i = 0; i < thm.lenght; i++) document.thm[i].style.border = "5px solid red"; } So all I'm trying to do here is to change the styles of the div's that have a class attribute with the value "articles". The function call works and a NodeList is created and placed in the variable thm . But before the first pass of the for loop, firebug is telling me that thm is undefined. You can see in the picture below that thm was infact defined and the NodeList was properly created and placed in the variable. Can someone tell me why thm is being returned undefined? querySlectorProblem by FutureWebDev, on Flickr Hello everybody, I have a little problem concerning variable visiblity and usage within inner functions. This is the javascript code: Code: function StateSuggestions() { states = []; var txtFile = new XMLHttpRequest(); txtFile.open("GET", "http://localhost:8182/www/search/GEMET.txt", true); txtFile.onreadystatechange = function(states) { if (txtFile.readyState === 4) { // Makes sure the document is ready to parse. if (txtFile.status === 200) { // Makes sure it's found the file. lines = txtFile.responseText.split("\n"); // Will separate each line into an array states.push("testInFunction") } } } states.push("testOutofIt"); txtFile.send(null); } The method "states.push("testoutOfIt")" works (adds an element to the array) but "states.push("testInFunction")" doesnt have an affect on the variable states although I gave the variable "states" as transfer parameter to the function. Can anybody maybe help me? Greetings, TsEMaNN Hello, I'm trying to write my class with member properties and functions like below. What I want to learn is that is there any problem to use prototype object in the class that we want to use with it? I asked because I generally see that prototype object definition and member functions and properties created outside of the class unlike my class that I wrote like below. Is there any problem writing my class like below? Thanks. Code: function Point() { Point.prototype.x = this._x; Point.prototype.y = this._y; function _setX(x) { this.x = x; } Point.prototype.setX = _setX; function _setY(y) { this.y = y; } Point.prototype.setY = _setY; function _show() { alert(this.x + this.y); } Point.prototype.Show = _show; } function callMyClass() { var p = new Point(); p.setX(3); p.setY(5); p.Show(); } Hi I was wondering if it is possible to add js logging onto a webpage and have this writing out to a separate file with the details? I have a page which is only showing the header and not the rest of the page, I want to add loggin code to find out where it is breaking. Is this possible and how would I go about setting it up? Hello, I am trying to parse a string using regular expressions. This string can potentially have any number of non-alphanumeric characters acting as delimiters. These delimiters can also be grouped together. Here are some examples of the data: 00923:5342:123 --> I want to extract 00923, 5342 and 123 into an array 08765::764375 --> parse this as 08765 and 764375 into an array 3246//672354//23458 --> parse as 3246, 672354 and 23458 23564-73654 --> etc I'm using the following code: Code: var ids = str.match(/\w*/g); But it just returns the first token from each line and ignores the rest. So with the above data I'm only getting back 00923, 08765, 3246 and 23564 into the first element of the "ids" array. I've also tried an "inverse" approach using the split method like so: Code: var ids = str.split(/\W*/g); and I just get the same result - the first token from each line is only returned. My test code looks like this ('str' contains a string read in from a file): Code: var ids = str.match(/\w*/g); //var ids = str.split(/\W*/g); task.logmsg("the length of the array is " + ids.length); for (i = 0; i < ids.length; i++) { task.logmsg("ids=[" + i + "]=" + ids[i]); } I can confirm that ids.length is returning 1 (??) The 'task' object comes from a separate library and the 'logmsg' method just writes to the console. My reptilian brain is struggling with reg exps. This shouldn't be difficult to do, but I just can't get it to work. If anyone out there can lend some assistance, it would be greatly appreciated. Thanks, JD Hello! I am trying to find a script that allows you to open multiple browser tabs and then close each of those tabs, either one by one or all at once. Does anyone know how to do this please? Thanks so much for your help. I want to have another go at Javascript. I have several books on the subject but I find that my eyesight is a major problem. Therefore I want to try an on-line solution, preferably free. I have Googled, but there are so many that I am almost dizzy with the choices. Perhaps someone could recommend one. Not too fussy visually. My knowledge is VERY basic. Frank Does anyone know how to make URL links that use Javascript still work when users have Javascript disabled on their browser? The only reason I'm using JS on a URL is because my link opens a PDF file, and I'm forcing it not to cache so users have the latest version. I tried the <script><noscript> tags, but I'm not sure if I'm using it correctly, as my URL completely disappears. Below is my HTML/Javascript code: <p class="download"> <script type="text/javascript">document.write("<span style=\"text-decoration: underline;\"><a href=\"javascript:void(0);\" onclick=\"window.open( 'http://www.webchild.com.au/mediakit/Direct_Media_Kit_Web.pdf?nocache='+ Math.floor( Math.random()*11 ) );\" >The Child Magazines Media Kit</a></span> (PDF 1 MB) ");</script> <noscript><span style="text-decoration: underline;"><a href="http://www.webchild.com.au/mediakit/Direct_Media_Kit_Web.pdf" >The Child Magazines Media Kit</a></span> (PDF 1 MB)</noscript> </p> Thanks for any help, Michael Hi, I have the following code snippet: test.html ====== <script language="javascript" type="text/javascript"> var testVariable = "test"; </script> <script language="javascript" type="text/javascript" src="test.js"> </script> test.js ===== var testVariable = window.top.testVariable; In firefox, I'm able to access testvariable defined within test.html in test.js. But in chrome, test.js couldnot get the window.top.testVariable field defined in test.html. Can any one please let me know how i can make it work in chrome?. Am i missing something here?. Hi Guys, I am new at JavaScript and start to do some tutorials.What I am trying to do here is prompting user to input a name and if the name was valid the page(document) will display with all objects like the button.But if user enter a wrong name then the button will be disabled! I create the following code but it did not work <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>New Web Project</title> <script language="JavaScript" type=""> function changeColor(){ document.bgColor = "Gray"; } </script> </head> <body> <script language="JavaScript" type="text/javascript"> var person = ""; person = prompt('What is Your Name:'); if (person == "Foo") { document.write("<h1 />Welcome " + person); document.bgColor = "Yellow"; } else { document.write("<h1 />Access Denied!!!!"); document.bgColor = "Red"; document.getElementById("gree").disabled = true; } </script> <div> <p/><input id="gree" type="button" value="Gray " onClick="changeColor();"> </div> </body> </html> as you can see I used the: document.getElementById("gree").disabled = true; but it did not work , could you please give an idea how I can solve this problem? Thanks Hi Guys I am trying to modify the functionality of my page. I want to be able to activate this piece of code using another javascript function. This is the code I want to activate: Code: <script type="text/javascript"><!-- $('#button-cart').bind('click', function() { $.ajax({ url: 'index.php?route=checkout/cart/update', type: 'post', data: $('.product-info input[type=\'text\'], .product-info input[type=\'hidden\'], .product-info input[type=\'radio\']:checked, .product-info input[type=\'checkbox\']:checked, .product-info select, .product-info textarea, .date_data input[type=\'text\']'), dataType: 'json', success: function(json) { $('.success, .warning, .attention, information, .error').remove(); if (json['error']) { if (json['error']['warning']) { $('#notification').html('<div class="warning" style="display: none;">' + json['error']['warning'] + '<img src="catalog/view/theme/default/image/close.png" alt="" class="close" /></div>'); $('.warning').fadeIn('slow'); } for (i in json['error']) { $('#option-' + i).after('<span class="error">' + json['error'][i] + '</span>'); } } if (json['success']) { $('#notification').html('<div class="success" style="display: none;">' + json['success'] + '<img src="catalog/view/theme/default/image/close.png" alt="" class="close" /></div>'); $('.success').fadeIn('slow'); $('#cart_total').html(json['total']); $('html, body').animate({ scrollTop: 0 }, 'slow'); } } }); }); //--></script> And this is how I want the format of the function to be: function testsession() { if there is a session called 'hiredate' { activate the script above } else { var el = document.getElementById("product_data"); } } I just dont know how to write this in javascript Could you help me if possible please I want to insert this js snippet Code: function addText(smiley) { document.getElementById('message').value += " " + smiley + " "; document.getElementById('message').focus(); return false; } to a loaded iframe with name&id chtifrm. I can access it & change embed something in its html via using something like: Code: $(parent.chtifrm.document.body).append('<div id=\"smly\" style=\"cursor:pointer;float:left;top:200px;display:none;position:absolute;\"><\/div>'); .... Code: parent.chtifrm.document.getElementById('chatbox_option_disco').style.display == 'none' but how do I insert js in the head of loaded iframe? I got an index.php Code: <html> <form action="bacakomik.php" method='post'> <select name="kodekomik"> <option value='../komik1/|23'>Judul Komik1</option> <option value="../komik2/|20">Judul Komik2</option> <option value="../komik3/|10">Juduk Komik3</option> <option value="../komik4/|20">Judul Komik4</option> </select> <input type="submit" /> </form> <?php echo ('<select>'); echo ('<option value= "'.$i.'">'.'Page '.$i.'</option>'); echo ('</select>'); ?> </html> As you can see, each of the option brings specific value "../komik1/|23" komik1 is a directory | is a delimiter 23 is the pages in one chapter and can be considered also as how many images are there on a specific directory This is my bacakomik.php Code: <?php $dirkomik = $_POST['kodekomik']; $exploded = explode("|", $dirkomik); echo ($exploded[0]); //picture directory echo ("<br>"); echo ($exploded[1]); //total page in the comic $pagecount = (int)$exploded[1]; //Take last posted value, process it right away echo ('<FORM name="guideform"> '); echo ('<select name="guidelinks">'); $i=1; do { echo ('<option value= "'.$i.'">'.'Page '.$i.'</option>'); $i= $i+1; }while($i <= $pagecount); //Printing option and select echo ("</select>"); ?> <input type="button" name="go" value="Go!" onClick="document.getElementById('im').src=document.guideform.guidelinks.options[document.guideform.guidelinks.selectedIndex].value+'.png';"> </FORM> <img src="img0.jpg" id="im"> With the current code on bacakomik.php, I only can change the img src of id "im" in the same directory only. What I want is that the Javascript could "add" the "$exploded[0]" variable so that the picture can be loaded from different directory. Anyone can do this? I believe that the fix should be somewhere on input tag inside OnClick, or do you know where? Anyway, I found this on the net http://p2p.wrox.com/php-faqs/11606-q...avascript.html Please help me to those who can... Hey, I've got to make the values of some textboxes change the co-ordinates of my sprite on a canvas and havent a clue on how to do it, Here is my form with the two textboxes and submit button: <form> x: <input type="text" name="x" /><br /> y: <input type="text" name:"y" /><br /> <input type="submit" value="Submit"/><br /> </form> And i need it so that they change the values of these: //this shows where my sprite will start on the canvas var block_x; var block_y; searched the internet for hours and cant really find anything i understand or works. any help is much appreciated All -- I have a JavaScript config file called gameSetting.js which contains a bunch of variables which configures a particular game. I also have a shared JavaScript library which uses the variables in gameSetting.js, which I include like so: <script type="text/javascript" src="gameSetting.js" ></script> <script type="text/javascript" src="gameLibrary.js" ></script> In gameSetting.js I have: $(document).ready(function() { // call some functions / classes in gameLibrary.js } in Firefox, Safari, and Chrome, this works fine. However, in IE, when it's parsing gameSetting.js, it complains that the functions that live in gameLibrary.js aren't defined. When it gets to parsing gameLibrary.js, the variables in gameSetting.js are reported as not being defined. I've tried dynamically bootstrapping the gameLibrary file using this function in document.ready for dynamic load... $.getScript("gameLibrary.js"); However, the same problem still happens in IE, where when it parses the files individually it's not taking into context the file/variables that came before, so it's not an out of load order problem. My options a 1) collapsing all the functions in gameLibrary.js and variables in gameSetting.js into one file. However, this is not practical because this is dealing with literally hundreds of games, and having a gameLibrary.js in ONE location for ONE update is what makes most logical sense. 2) figure out a way to get this to work where variables in file1 are accessible to file2 in IE (as it seems they are in other browsers). jQuery seems to be able to have multiple plugins that all refer to the based jQuery-1.3.2.js, so I know there is a way to get this to work. Help appreciated. Nero I wrote a log function that took note of various function calls. Thinking that functions are first class objects, and objects have properties, I made the name of each logged function a property of that function, e.g., brightenInnerPara.name = "brightenInnerPara"; Every browser I tried (Firefox, MSIE, Opera, Chrome, Safari) accepted the assignment, no problem. In Firefox and MSIE, the result was what I wanted: brightenInnerPara.name == "brightenInnerPara" But in the others, the result was: brightenInnerPara.name == null Question 1. Which Javascript is correct here? I favor Firefox and MSIE, not merely because they were willing to give me what I wanted, but also because it makes no sense to accept an assignment statement without throwing an error and then give it a null semantics, like Chrome, Opera, and Safari did. I found a workaround, using assignments like this: brightenInnerPara.prototype.name = "brightenInnerPara"; To my surprise, that worked in every browser. But I don't know why. It seems that such assignments are enough to cause each function to have its own distinct prototype. Question 2. Just how inefficient is my workaround, and why does it work? |