JavaScript - Trying To Make A Live Regex Tester - Have Problem
Hi all,
First... this isn't homework... Now, I'm trying to make a live Regular Expression evaluator and I thought it would be really simple, but it's not working. Here's the JS I wrote..... Code: <html> <head> <style type="text/css"> body { background-color:#ddeeff; } textarea#inp1, textarea#inp2, textarea#out1 { margin:0 25%; margin-bottom:1%; border:0; padding:0; width:50%; height:100px; border: 1px solid #000000; } p { margin:0 25%; } </style> <script type="text/javascript"> function test() { var inp1 = document.getElementById('inp1'); /* regex in here */ var inp2 = document.getElementById('inp2'); /* test string here */ var out1 = document.getElementById('out1'); /* results here */ r = inp1.value.split(','); /* get find , replace */ var str = inp2.value; var find = r[0] || ''; var repl = r[1] || ''; var result = str.replace(find, repl); out1.value = result; } </script> </head> <body> <p>regex</p> <textarea id="inp1"></textarea> <p>test string</p> <textarea id="inp2"></textarea> <p>result</p> <textarea id="out1"></textarea> <script type="text/javascript"> setInterval('test()', 100); </script> </body> </html> Now, it DOES work if I do something simple like enter the word "Test" for the test string and T,X for the "regex" (the result transforms into "Xest" as it should). But if I put in something like this: /<p(.*?)>(.*?)<\/p>/gi,'$2' for the regex and <p class="test">Hello</p> for the test string The result is <p class="test">Hello</p> when it should be just Hello I can put regex strings into an array and of course it works (for example): Code: var find = [/<p>/g,/<\/p>/g]; var repl = ['P open', 'P close']; var n = find.length; while (n--) str = str.replace(find[n], repl[n]); ...blah...blah... So why doesn't my code work when I'm using variables that contain find and replace strings??? Am I missing something, or can it not be done this way? -- Roger (edit to add): The above code is online HERE Similar TutorialsGuys can u help how to make code 'letters only' without regex? And how to make simple captcha with the output like this => FP715,but still regex isnt allowed. Thank you I am using the below regex to extract the subdomain from the url Code: ^(?!www)([^.]+)\.mydomain\.com The above code extracts subdomain only when the url is typed as Quote: subdomain.mydomain.com But I need a regex which extracts sudomain when the url is typed with WWW and without WWW as below Quote: subdomain.mydomain.com www.subdomain.mydomain.com Kindly help me. Hi all, I have a string which contains HTML and *possibly* IMG tags. I am trying to extract part of each IMG tag which may be in the string. The string is part of a chat-box message which may or may not contain smilies. Here is a typical line of text, without processing (note I mis-spell the bbcode "quote" so as not to fool this board): Code: [qoute="Krupski"]<img src="./images/smilies/smile.gif" alt=":smile:" title="smile" /> <img src="./images/smilies/thumbsup.gif" alt=":thumbsup:" title="thumbsup" /> <img src="./images/smilies/thumbsdown.gif" alt=":thumbsdown:" title="thumbsdown" />[/qoute] Notice that each image has an "ALT" attribute which contains the smiley code of the smiley image. THAT is what I want to extract. This is the regex I am using to grab each smiley code: Code: txt = txt.replace(/<img(?:.*?):(.*?):(?:.*?)\/>/gi,':$1:'); The weird thing is, the regex grabs the FIRST and LAST of the three, but not the middle one! I'm sure the stupid mistake is sitting right in front of my face, but I'm not seeing it. Any help will be greatly appreciated! Thanks. -- Roger Code: var bakaBanner; bakaBanner = document.getElementById('head'); if (bakaBanner) { var str=/\/images\/banners\/[A-Za-z0-9_]+.[a-z]+/; document.write(str.replace(/\/images\/banners\/[A-Za-z0-9_]+.[a-z]+/, "http://img218.imageshack.us/img218/5904/revyblacklagoon1.png")); } Alright, here's the deal... This is a script to be used in Greasemonkey. The page this is for changes their banner every 5 minutes, the name changes and it could be either jpg or png. I'm fairly certain my regex itself: \/images\/banners\/[A-Za-z0-9_]+.[a-z]+ Is correct... Here's an example of what it's looking through: Code: <div id="head" style="background-image: url(/images/banners/kiminitodoke.jpg);" > <div id="header_left"> <div id="rss"> My guess is that it has something to do with this line: document.write(str.replace(/\/images\/banners\/[A-Za-z0-9_]+.[a-z]+/, "http://img218.imageshack.us/img218/5904/revyblacklagoon1.png")); I'm new with Javascript, so I don't really understand why it's not working... :/ Hi pals, I am really tired in this problem of event keyup. I given same in my keyup function like: $(document).ready(function () { alert("GGG"+parseInt(jQuery.browser.version)); //To display test value working $("#find_text").keyup(function(e) { if(e.which == 13) { alert('Enter key was pressed'); //enter Here alert("FFF"+parseInt(jQuery.browser.version)); //Here got Error } }); }); I got Error : jQuery is not defined alert("FFF"+parseInt(jQuery.browser.version)); I use keycode,which , but no help, It's Work nicely in Chrome Browser but not in FF. Please give a Solution reply ASAP, I am really Tired.The code enter the Condition But that jQuery part make error. Thankfully Anes P.A Hi guys im trying use a live search on my website, and iv found a code on the following link: http://www.w3schools.com/php/php_ajax_rss_reader.asp i understand it all but need to tweak it to suit my needs. What i need for it to do is search multiple drop down requests, for example: 1. first name 2. last name I want it to search by what has been selected (it is not necesary that all fields need to be selected, default will be any), however in the html it states: xmlhttp.open("GET","getrss.php?q="+str,true); and it only shows 1 option, i would like it to show multiple records. and once the records are shown, I would like the option of amending the search result any time in the search. please help Can some one help me step me through this last part of my script i have made. I have completed my entire chat program but currently i use: <meta http-equiv="refresh" content="5; URL=shout.php"> This is what keeps my chat room up to date, but this is pretty ugly due to the fact the browser makes a refresh. So i was hopeing some one could step my through to add ajax that makes a live affect with it appear to refresh. The script that has this chat is in the structure of: Code: <meta http-equiv="refresh" content="5; URL=shout.php"> <?php function get_chats(){ //query //while loop the logs out } getlogs(); ?> And thats it. I took a look on W3 about ajax and most of it was involve an event occuring such as submit/on key press which isn't what i want as some times a user may not do anything but i still want the chat to keep "up to date". I found one tutorial but it was over complicated to just take snippets out to put on my chat without knowing what it did or what to change for my chat to make it to work. Hope you can help - im a quick learner when i see the right example of what i need. Hey I've created a new homepage for my cubecart shop, but when I upload it it doesn't display, I've check all resources and they are all being loaded Here is the site: http://www.genyx.co.uk/ Here is what it is supposed to look like: http://www.genyx.co.uk/Genyx%20Theme/html/index.htm Can anyone help? I'm trying to figure out how to display the live price of gold on a site. I've been googling for 2 hours and have gotten nowhere, most results are people trying to sell you something. I just want a simple display of the price of gold on a site, and don't know where to start. If anyone has any idea, or has done something similar to this, let me know. I appreciate it I have an external .js file that ends its process with a document.write() command. This needs to be called near the end of the HTML page, right before </body>. Am I better off calling the external .js at the desired location in the footer? Or making the .js into a defined function, loading the .js in the <head> portion and then executing the function in the footer? - M. Do you log JavaScript errors on your live website? The actual errors that users experience? If you do, what tool do you use? And how is it woring out? If you don''t why not? so im interested by those video of people walking out and talking on the screen like these links below: http://www.premiumpostcard.com/ http://www.forcefactor.com/?&fb_lgid...4aaade4060d68b know my rational brain thinks well its just a video that is played with the background white or Green Screened to whatever. but the way i would do it in dreamweaver to insert a swf or video would provide a play button and stuff which these videos don't have. is there a code resource that i could apply to make this happen somewhere out there? Hi, I'm working on a project that will display a form that takes in the amount of Money I earn in a given month. This value is inserted into the code, and once submitted, a Live Updating value will display how much $ I would have earned so far this month. This counter will work and display much like Gas Pumps increment. So in example: I type in that I make $1,000 per month. Once submitted, the count begins. The code will figure out how much money I will be making every second of the day, and update it live. This value updates live displaying something like $0.0012. If I earn $1 Million per month, then the values would increment much faster. Could anyone give me some input? Thanks http://turtle-tv.com I already have the server time (top left) in a live format but this other bit is a bit much for me as I know little to nothing about JS and the code in question isnt mine. Anyway, the bit in the parenthesis which depending on the current server time will read Lights on in ??? or Lights off in ??? I would like to have turned in to a liver ticker while keeping all of it's current functionality. Like lets say it was 7:59:59pm EST time the message in the parenthesis would read (Lights off in 1 sec) then come 8:00:00pm the message would do a live rollover to read (Lights on in 11 Hrs, 30 Mins & 0 Secs) then count down from there and then come lets say 7:39:59am EST the message would read (Lights on in 1 Sec) and come 7:30:00am EST the message would roll over to the lights off message. If this is something you can do then great but if not then thankyou for at least reading my post. If you are able to do this and can improve on existing code for the liver server clock then please do that as well as there's some redundant code I don't even need for stuff liek the day etc since I'm just displaying as hh:mm am/pm clock in a 12hr format. Code: <head> <title>Niko's Live 24/7 Video Broadcast</title> <script type="text/javascript"> var weekdaystxt=["Sun", "Mon", "Tues", "Wed", "Thurs", "Fri", "Sat"] function showLocalTime(container, servermode, offsetMinutes, displayversion){ if (!document.getElementById || !document.getElementById(container)) return this.container=document.getElementById(container) this.displayversion=displayversion var servertimestring=(servermode=="server-php")? '<? print date("F d, Y H:i:s", time())?>' : (servermode=="server-php")? '<!--#config timefmt="%B %d, %Y %H:%M:%S"--><!--#echo var="DATE_LOCAL" -->' : '<%= Now() %>' this.localtime=this.serverdate=new Date(servertimestring) this.localtime.setTime(this.serverdate.getTime()+offsetMinutes*60*1000) //add user offset to server time this.updateTime() this.updateContainer() } showLocalTime.prototype.updateTime=function(){ var thisobj=this this.localtime.setSeconds(this.localtime.getSeconds()+1) setTimeout(function(){thisobj.updateTime()}, 1000) //update time every second } showLocalTime.prototype.updateContainer=function(){ var thisobj=this if (this.displayversion=="long") this.container.innerHTML=this.localtime.toLocaleString() else{ var hour=this.localtime.getHours() var minutes=this.localtime.getMinutes() var seconds=this.localtime.getSeconds() var ampm=(hour>=12)? "pm" : "am" var dayofweek=weekdaystxt[this.localtime.getDay()] <!-- // this.container.innerHTML=formatField(hour, 1)+":"+formatField(minutes)+":"+formatField(seconds)+" "+ampm+" ("+dayofweek+")" this.container.innerHTML=formatField(hour, 1)+":"+formatField(minutes)+""+ampm+"" // --> } setTimeout(function(){thisobj.updateContainer()}, 1000) //update container every second } function formatField(num, isHour){ if (typeof isHour!="undefined"){ //if this is the hour field var hour=(num>12)? num-12 : num return (hour==0)? 12 : hour } return (num<=9)? "0"+num : num//if this is minute or sec field } </script> </head> <body background="./smalls_file_mainBg_1919366_7636654_l.jpg"> <font size="2" color="FFFF00" style="background: #181818;">Time Now: <span id="timecontainer">Loading...</span></font> <script type="text/javascript"> new showLocalTime("timecontainer", "server-php", 0, "short") </script> <?php $lights_on = '7:30am'; $lights_off = '8pm'; $time = lights_on_off(time(), $lights_on, $lights_off); ?> <center> <font size="5" color="FFFF00" style="background: #181818;"> Lights out from <?php echo $lights_off; ?> to <?php echo $lights_on; ?> <?php echo date('T'); ?> (Lights <?php echo $time['n_state']; ?> in <?php $h = ($time['remaining']['m'] + 1 ==60) ? $time['remaining']['h'] + 1 : $time['remaining']['h']; $m = ($time['remaining']['m'] + 1 ==60) ? 0 : $time['remaining']['m']; $s = ($time['remaining']['m'] + 1 ==60) ? 0 : $time['remaining']['s']; echo ($h>1) ? $h . ' Hrs, ' : (($h==1) ? $h . ' Hr, ' : ' '); echo ($m>1) ? $m . ' Mins & ' : (($m==1) ? $m . ' Min & ' : ' '); echo ($s>1) ? $s . ' Secs' : (($s==1) ? $s . ' Sec' : '0 Secs'); ?> ) !</font></center> <?php function lights_on_off($time, $lights_on, $lights_off){ $time = (isset($time)) ? $time : time(); $d_lights_on = strtotime($lights_on); $d_lights_off = strtotime($lights_off); $secs_lights_on = (date("G",$d_lights_on)*60 + date("i",$d_lights_on))*60 + date("s",$d_lights_on); $secs_lights_off = (date("G",$d_lights_off)*60 + date("i",$d_lights_off))*60 + date("s",$d_lights_off); $secs = (date("G",$time)*60 + date("i",$time))*60 + date("s",$time); $c_state = ($secs_lights_on < $secs && $secs < $secs_lights_off) ? 'on' : 'off'; $n_state = ($secs_lights_on < $secs && $secs < $secs_lights_off) ? 'off' : 'on'; $next_switch = ($secs_lights_on < $secs && $secs_lights_off > $secs) ? $secs_lights_off : ($secs_lights_on + 60*60*24); $next_switch = ($next_switch > ($secs+60*60*24)) ? $next_switch - (60*60*24) : $next_switch; $time_rem = $next_switch - $secs; $h = floor($time_rem/(60*60)); $m = floor(($time_rem-($h*60*60))/60); $s = $time_rem-($h*60*60)-($m*60); return array('c_state' => $c_state,'n_state' => $n_state, 'remaining' => array('secs' => $next_switch, 'h' => $h, 'm' => $m, 's' => $s)); } ?> <center> <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="600" height="523" id="utv451302"> <param name="flashvars" value="autoplay=false&brand=embed&cid=1919366"/><param name="allowfullscreen" value="true"/> <param name="allowscriptaccess" value="always"/><param name="movie" value="http://www.ustream.tv/flash/live/1/1919366"/> <embed flashvars="autoplay=false&brand=embed&cid=1919366" width="625" height="545" allowfullscreen="true" allowscriptaccess="always" id="utv451302" name="utv_n_740840" src="http://www.ustream.tv/flash/live/1/1919366" type="application/x-shockwave-flash" /></object> <iframe scrolling="no" height="523" frameborder="0" width="576" src="./prochatrooms/index.php"></iframe> </center> </body> So, I am working out a current issue I'm having with a sortable table script. Code: var sortableTable = new Class({:thumbsup: getOptions: function(){ return { overCls: false, onClick: true, sortOn: 0, sortBy: 'ASC', filterHide: true, filterHideCls: 'hide', filterSelectedCls: 'selected' }; }, initialize: function(table, options){ this.setOptions(this.getOptions(), options); this.table = $(table); this.tHead = this.table.getElement('thead'); this.tBody = this.table.getElement('tbody'); this.tFoot = this.table.getElement('tfoot'); this.elements = this.tBody.getElements('tr'); this.filtered = false; /*for(i=0;i<10;i++){ this.elements.clone().injectInside(this.tBody); } this.elements = this.tBody.getElements('tr');*/ //THIS IS FOR ANIMATION AND POINTER EFFECT ON HOVER this.elements.each(function(el,i){ if(this.options.overCls){ el.addEvent('mouseover', function(){ el.addClass(options.overCls); }, this); el.addEvent('mouseout', function(){ el.removeClass(options.overCls); }); } if(this.options.onClick){ el.addEvent('click', options.onClick); } }, this); //setup header this.tHead.getElements('th').each(function(el,i){ if(el.axis){ el.addEvent('click', this.sort.bind(this,i)); el.addEvent('mouseover', function(){ el.addClass('tableHeaderOver'); }); el.addEvent('mouseout', function(){ el.removeClass('tableHeaderOver'); }); el.getdate = function(str){ // inner util function to convert 2-digit years to 4 function fixYear(yr) { yr = +yr; if (yr<50) { yr += 2000; } else if (yr<100) { yr += 1900; } return yr; }; var ret; // if (str.length>12){ strtime = str.substring(str.lastIndexOf(' ')+1); strtime = strtime.substring(0,2)+strtime.substr(-2) }else{ strtime = '0000'; } // // YYYY-MM-DD if (ret=str.match(/(\d{2,4})-(\d{1,2})-(\d{1,2})/)) { return (fixYear(ret[1])*10000) + (ret[2]*100) + (+ret[3]) + strtime; } // DD/MM/YY[YY] or DD-MM-YY[YY] if (ret=str.match(/(\d{1,2})[\/-](\d{1,2})[\/-](\d{2,4})/)) { return (fixYear(ret[3])*10000) + (ret[2]*100) + (+ret[1]) + strtime; } return 999999990000; // So non-parsed dates will be last, not first }; // el.findData = function(elem){ var child = elem.getFirst(); if(child){ return el.findData(child); }else{ return elem.innerHTML.trim(); } }; // el.compare = function(a,b){ var1 = el.findData(a.getChildren()[i]); var2 = el.findData(b.getChildren()[i]); //var1 = a.getChildren()[i].firstChild.data; //var2 = b.getChildren()[i].firstChild.data; if(el.axis == 'number'){ var1 = parseFloat(var1); var2 = parseFloat(var2); if(el.sortBy == 'ASC'){ return var1-var2; }else{ return var2-var1; } }else if(el.axis == 'string'){ var1 = var1.toUpperCase(); var2 = var2.toUpperCase(); if(var1==var2){return 0}; if(el.sortBy == 'ASC'){ if(var1<var2){return -1}; }else{ if(var1>var2){return -1}; } return 1; }else if(el.axis == 'date'){ var1 = parseFloat(el.getdate(var1)); var2 = parseFloat(el.getdate(var2)); if(el.sortBy == 'ASC'){ return var1-var2; }else{ return var2-var1; } }else if(el.axis == 'currency'){ var1 = parseFloat(var1.substr(1).replace(',','')); var2 = parseFloat(var2.substr(1).replace(',','')); if(el.sortBy == 'ASC'){ return var1-var2; }else{ return var2-var1; } } } if(i == this.options.sortOn){ el.fireEvent('click'); } } }, this); }, sort: function(index){ if(this.options.onStart){ this.fireEvent('onStart'); } // this.options.sortOn = index; var header = this.tHead.getElements('th'); var el = header[index]; header.each(function(e,i){ if(i != index){ e.removeClass('sortedASC'); e.removeClass('sortedDESC'); } }); if(el.hasClass('sortedASC')){ el.removeClass('sortedASC'); el.addClass('sortedDESC'); el.sortBy = 'DESC'; }else if(el.hasClass('sortedDESC')){ el.removeClass('sortedDESC'); el.addClass('sortedASC'); el.sortBy = 'ASC'; }else{ if(this.options.sortBy == 'ASC'){ el.addClass('sortedASC'); el.sortBy = 'ASC'; }else if(this.options.sortBy == 'DESC'){ el.addClass('sortedDESC'); el.sortBy = 'DESC'; } } // this.elements.sort(el.compare); this.elements.injectInside(this.tBody); // if(this.filtered){ this.filteredAltRow(); }else{ this.altRow(); } // if(this.options.onComplete){ this.fireEvent('onComplete'); } }, altRow: function(){ this.elements.each(function(el,i){ if(i % 2){ el.removeClass('altRow'); }else{ el.addClass('altRow'); } }); }, filteredAltRow: function(){ this.table.getElements('.'+this.options.filterSelectedCls).each(function(el,i){ if(i % 2){ el.removeClass('altRow'); }else{ el.addClass('altRow'); } }); }, filter: function(form){ var form = $(form); var col = 0; var key = ''; form.getChildren().each(function(el,i){ if(el.id == 'column'){ col = Number(el.value); } if(el.id == 'keyword'){ key = el.value.toLowerCase(); } if(el.type == 'reset'){ el.addEvent('click',this.clearFilter.bind(this)); } }, this); if(key){ this.elements.each(function(el,i){ if(this.options.filterHide){ el.removeClass('altRow'); } if(el.getChildren()[col].firstChild.data.toLowerCase().indexOf(key) > -1){ el.addClass(this.options.filterSelectedCls); if(this.options.filterHide){ el.removeClass(this.options.filterHideCls); } }else{ el.removeClass(this.options.filterSelectedCls); if(this.options.filterHide){ el.addClass(this.options.filterHideCls); } } }, this); if(this.options.filterHide){ this.filteredAltRow(); this.filtered = true; } } }, clearFilter: function(){ this.elements.each(function(el,i){ el.removeClass(this.options.filterSelectedCls); if(this.options.filterHide){ el.removeClass(this.options.filterHideCls); } }, this); if(this.options.filterHide){ this.altRow(); this.filtered = false; } } }); sortableTable.implement(new Events); sortableTable.implement(new Options); It works flawlessly on my dev page: http://www.align.com/Dev/Resources/ But I am having issues with is on my live page: http://www.align.com/Resources/ My first thought is that it could be a labeling issue (ie: I forgot to remove "/dev" when moving the HTML over to live) but after reviewing for an hour, I don't believe this is the issue. Could it be an ASP issue? thx in advance.... -Mike Fortuna I want to run a piece of javascript on a live page that I don't have backend control of. I know it's possible. I've never done it before though. I'm in google chrome. This is what I see. I have no idea what I'm doing Hi, I got this code from w3schools and I want to alter it for my needs. However I can not get the basic example to work. I have repeatedly cross checked it and can't see any error. I wonder if anyone can spot what I am doing wrong. Code: </script> <script type="text/javascript"> function showHint(str){ if (str.length==0){ document.getElementById("txtHint").innerHTML=""; return; } if (window.XMLHttpRequest){ xmlhttp=new XMLHttpRequest(); } else{ xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange=function(){ if {xmlhttp.readyState==4 && xmlhttp.status==200){ document.getElementById("txtHint").innerHTML=xmlhttp.responseText; } } xmlhttp.open("GET","getName.php?q="+str,true); xmlhttp.send() } </script> </head> <body> <label>Search by name: </label> <input type="text" id="txt1" class="input" onkeyup="showHint(this.value)" /> <br /> <p>Suggestions: <span id="txtHint"></span></p> <br /> </body> And my getName.php is: PHP Code: <?php $a[]="Anna"; $a[]="Amalie"; $a[]="Amelie"; $a[]="Amanda"; $a[]="Amel"; $a[]="Amely"; $q=$_GET["q"]; if (strlen($q) > 0){ $hint=""; for ($i=0; $i<count($a); $i++){ if (strtolower($q)==strtolower(substr($a[$i],0,strlen($q)))){ if ($hint==""){ $hint=$a[$i]; }else { $hint=$hint." , ".$a[$i]; } } } } if ($hint == ""){ $response="no suggestion"; }else{ $response=$hint; } echo $response; ?> Nothing happens when I start typing in the name box. Hi I hope someone can help me or direct me to the right place.... Here is the situation. I am a graphic guy and do some web design but am not really good with javascript. I am using the enlargeit.js program for the photo viewer on www.blackwoodsconcrete.com in the galleries. It has worked wonderfully up till now. I recieved new pictures from the owner to post on his page and they will not open when i view them live. I use dreamweaver cs5 and when i look in preview mode, they work great. They are standard jpg images. see http://www.blackwoodsconcrete.com/example_error.html for an example. The top pic does not work and the rest do... I have resized them, changed file formats, opened them in photoshop and edited them, and basically anything else you could think of, i tried. Even if i open one of the working photos in photoshop and place the new one over it and save it as something completely different it still does not work! everything else does. Does anyone have any clue what to do? Thanks in advance! TK |