JavaScript - Locating Searching For Text Within Iframe Or Frame
I have referenced the following thread for ideas on the issue I want solved, but only took it as far as I can. Any help would be great.
http://codingforums.com/showthread.php?t=202459 I would like to utilize this script where I could pass the string of words to another page. Meaning, search for the text, actually a word, then take the two words following the searched text and have them passed to the next page...I have tried to "alert" the words, but have no success. I have tried to modify the code using the following, but the result just posts a "-1" in my alert popup. As you can see I modified the code from the original thread in the third block of "for" code. also, I added an "alert" tag. One more thing, I added a function call for the form button. Hope you can help out. The code is below: Code: <script type="text/javascript"> var count = 0; var itemList = new Array(); var oldText = ""; var rawText = ""; var workText = ""; function highlight() { // overcome problem in Firefox caused by blank fields itemList[0] = document.getElementById("txt1").value == '' ? "FireSchmoxStryng" : document.getElementById("txt1").value; itemList[1] = document.getElementById("txt2").value == '' ? "FireSchmoxStryng" : document.getElementById("txt2").value; itemList[2] = document.getElementById("txt3").value == '' ? "FireSchmoxStryng" : document.getElementById("txt3").value; if (count == 0) { rawText = document.getElementById('subjectMatter'); workText = rawText.innerHTML; oldText = rawText.innerHTML; } else { workText = oldText; } workText = workText.replace(/(\<)/g," $1").replace(/(\>)/g,"$1 "); for (i=0; i<itemList.length; i++) { itemList[i]= itemList[i].replace(/^\s+|\s+$/g,""); var currWord = new RegExp("([\\s\\r\\n\(]*"+itemList[i]+"[\\s,;\.:?!\'\"()-]+)",'gi'); workText = workText.replace(currWord," <span class='highLight'>$1<\/span> "); } for (i=0; i<itemList.length; i++) { var currWord = new RegExp("(\<\/span\>\\s)([0-9a-z%,;:\.?!\"\'()]+\\s)",'gi'); workText = workText.replace(currWord," $1<span class='highLight'>$2<\/span> "); } for (i=0; i<itemList.length; i++) { var currWord = new RegExp("(\\s[0-9a-z%,;.:?!'()]+)(\\s\<span class='highLight'>)",'gi'); workText = workText.replace(currWord," <span class='highLight'>$1<\/span>$2 "); Text = workText.indexOf(currWord); var url = "http://www.blank.com/results.php?searched=" + Text; } rawText.innerHTML = workText; count ++; alert(url); } </script> <style type="text/css"> body {font-family: arial; font-size: 10pt; margin-top: 60px; margin-bottom: 60px; background-color: #f5f5f5;} .highLight {font-family: arial; font-size: 10pt; color: #00008B; font-weight: bold; cursor: help;} </style> </head> <body> <form> First word or phrase to find <input type = "text" id = "txt1" size = "50"><br> Second word or phrase to find <input type = "text" id = "txt2" size = "50"><br> Third word or phrase to find <input type = "text" id = "txt3" size = "50"><br><br> <input type = "button" value = "Highlight Selected" onclick = "highlight()"> <input type = "reset" value = "Reset Form"> <!--<input type = "button" value = "Reset Results" onclick = "document.getElementById('subjectMatter').innerHTML = oldText">--> <input type = "button" value = "Reset Results" onclick = "highlight()"> </form> <br> <div id='subjectMatter'> Join Chief Economist Mark Zandi and Director of Housing Economics Celia Chen for an introduction to Housing in Crisis: When Will Metro Markets Recover?, a new study that offers a comprehensive look at the near-term prospects for a recovery in housing markets in a recessionary environment. In addition, Dr. Zandi will critique the effectiveness of policy thus far in the housing crisis and discuss additional measures the Obama administration will enact that are assumed in the Moody's Economy.com house price forecast. Key findings:- In about 10% of metro areas, price declines will exceed 30%. Economic experiments in virtual worlds (or, more generally, virtual economies) have been proposed a number of times and also conducted to some extent. A recent addition to the conducting category is Reciprocity and status in a virtual field experiment by Andreas Nicklisch and Tobias Salz. In their study, the authors conducted a field study in World of Warcraft, seeking to investigate the role of reciprocity, and the effect of status on reciprocity, in employment relations. Reciprocity here means the observed tendency to react kindly to kind actions, even though such reactions are not enforced. Unlike previous economic experiments conducted in virtual worlds, the authors did not create an artificial setup for the experiment. Below, I summarize and briefly discuss the study and its findings. Economic experiments in virtual worlds (or, more generally, virtual economies) have been proposed a number of times and also conducted to some extent. A recent addition to the conducting category is Reciprocity and status in a virtual field experiment by Andreas Nicklisch and Tobias Salz. In their study, the authors conducted a field study in World of Warcraft, seeking to investigate the role of reciprocity, and the effect of status on reciprocity, in employment relations. Reciprocity here means the observed tendency to react kindly to kind actions, even though such reactions are not enforced. Unlike previous economic experiments conducted in virtual worlds, the authors did not create an artificial setup for the experiment. Below, I summarize and briefly discuss the study and its findings. </div> </body> </html> Similar TutorialsIm trying to use javascript to search a text file. text file is like this... 1111111[TAB]Project Name[TAB]Application1 2222222[TAB]Project Name[TAB]Application2 Im trying to get the javascript to let a user search for number or project name, if found it displays all the info if found. application1 or application2 (whatever is in the 3rd area) The text file can also be seperated by commas, either way is fine. can anyone help with this. ? Ok, here is the scenario... We have a commercial shopping cart software installed on our website and since it is proprietary, we do not have access to source code. But they do allow you to include custom javascript on the web pages that they generate. What I want to do is add some text after a specifc INPUT tag that appears on the page within a TD tag. The problem is, that they do not have any specifc ID assigned to the INPUT or TD tag, and although the INPUT tag has a name assigned to it, the name is used in other tags as well and is not unique. Below is the code that I used to solve the problem, but I want to know if there is a more efficient way to do it... Basically my code grabs every TD tag on the page, and then loops thru all of them looking for the specifc INPUT tag characteristics and then inserts the text afterwards (it needs to work in both Firefox and IE so you cannot use innerHTML). Thanks in advance for any suggestions! Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta http-equiv="content-type" content="text/html; charset=windows-1250"> <meta name="generator" content="PSPad editor, www.pspad.com"> <title></title> <script type="text/javascript"> function myLoad() { var _match = false; var _tdcells = document.getElementsByTagName('td'); var _len = _tdcells.length; for (var _i=0; _i<_len; _i++) { _child = _tdcells[_i].childNodes; _child_len = _child.length; for (_j=0; _j<_child_len; _j++) { if ( (_child[_j].nodeType == 1) && (_child[_j].attributes.getNamedItem('name').value == 'zip_code') && (_child[_j].attributes.getNamedItem('onchange').value == 'zip_changed();') && (_child[_j].attributes.getNamedItem('type').value == 'text') && (_child[_j].attributes.getNamedItem('size').value == '10')) { _cell = _i + 1; alert('Found a match in cell number '+_cell); _match = true; var old_node = _child[_j]; var new_node = document.createTextNode(' New Text!'); //Insert Before usually inserts before the element, but using targetElement.nextSibling inserts it after instead!! _tdcells[_i].insertBefore(new_node, old_node.nextSibling); } } } if (_match !== true) { alert('no match found'); } } </script> </head> <body onLoad="myLoad();"> <table class="zipncountry" border="1"> <tr> <td>1</td> <td>2</td> <td>3</td> </tr> </table> <br> <table border="3"> <tr> <td>4</td> <td>5</td> <td><input type="text" name="zip_code" value="123" size=10 maxlength=20 onChange="zip_changed();"><input type="hidden" name=zip_code value="321" size=10 maxlength=20 ></td> </tr> </table> <br> <table class="zipncountry" border="5"> <tr> <td>7</td> <td>8</td> <td>9</td> </tr> </table> </body> </html> Hi guys, this is my first post so be gentle. The problem I am having is this.. I want to have a link so that when you put your mouse over it, an image will be displayed in another frame. I thought this would not be as hard as it has been other wise i would not be turning to you for help. this is the link right now: <a href="http://www.dickblick.com/zz529/47/" rel="nofollow" target="_blank">Alvin 4-Piece Creative Center</a> its just a standard link. the image is located at /images/alvin_wood.jpg here is what I have tried so far.. I have tried using the window.open command and that seemed to work but i could not get it to open in a size of my determiation.. ie 200 by 300 (random demensions i just threw out). ive tried this: <a href="javascript: onMouseOver="window.open('images/picture.jpg')"> Ive tried using the showtrail and hide trail functions ( i think they are functions), and a slew of others but i got mad and deleted it... i prolly shouldnt have done that.. but ill find it and post it so you can see. http://www.stockxpert.com/browse.phtml?f=s&c=100 that is what i want to do except starting off it would be the link and then the image would pop up... I dont even care if its in another frame.. I can take that frame out its not a bid deal.. ive been screwing with this for two weeks and this is my last bit of effort to find an answer.. SO!! if anyone can help I would be greatful!! THANK YOU! Hi. I have a question about java script code. I'm creating a website with frames. Within the main page frame, there are tables in the main content page. When I created the website, it fit perfectly in the browser window of my smaller laptop. I just checked it out on my old G5 and the images/pages are too big and either cut off or scroll bars appear (which is not what I want) So I wanted to know what code I put in my files and where to put it? Also, what pages does it need to be in? the main frame index page? the specific pages that fit within the frames? some are images that load in the frames? would i need to create an .html for those and then have the .jpg load so that it can be resized? I need the main page to be resized to fit the browser as well as the pages in the frames to fit. Can you help? Thanks I' am trying to do a frame by frame animation, lik an animated gif. I am using svg (vector graphics) and IE9 has native support for svg. The code functions in every other browser but IE9 plays the animation once then nothing. If you would like to try and not have svg files you can use whatever gif,jpg or png just put an img-tag where i have embed. Code: <!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <title>Animation</title> <style type="text/css"> /*One div per image all uses this class*/ .eyesPos { position:absolute; width:80px; height:50px; z-index:1; left: 0px; top: 0px; } #eye_wrapper{/*This is a master div for easy placement of the others*/ position:absolute; width:80px; height:50px; z-index:2; left: 275px; top: 200px; } </style> <script> var eyes=["a","b","c","d"];//Image id in this array var startAnim=setInterval(visaOga,100);//Animation speed function visaOga(){ document.getElementById(eyes.splice(0,1)).style.display="block"; if(eyes.length==0){ document.getElementById("a").style.display="none"; document.getElementById("b").style.display="none"; document.getElementById("c").style.display="none"; dBort = function(){ document.getElementById("d").style.display="none"; eyes=["a","b","c","d"]; } setTimeout(dBort,1500);//So last image is shown 1.5 sec return;//Aborts - dBort -. Sequence can start over if(document.getElementById("d").style.display=="none"){ startAnim;//Strts sequence if last image invisible } } } </script> </head> <body> <!--Images in own div invisible at start--> <div id="eye_wrapper"> <div class="eyesPos" id="a" style= display:none;> <embed src="0.svg" width="80" height="50" /> </div> <div class="eyesPos" id="b" style= display:none;> <embed src="1.svg" width="80" height="50" /> </div> <div class="eyesPos" id="c" style= display:none;> <embed src="2.svg" width="80" height="50" /> </div> <div class="eyesPos" id="d" style= display:none;> <embed src="3.svg" width="80" height="50" /> </div> </div> </body> </html> Hello I need to get text from an iframe. I tried this example (I've found it on this board): Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>Example</title> <style type="text/css"> </style> <script type="text/javascript"> // <![CDATA[ window.onload = function() { // treat iframe_window as if it were your iframes window (which it is) var iframe_window = window.frames["my_iframe"]; // compare the following line to: window.document.getElementsByTagName("body")[0].innerHTML; var iframe_body_html = iframe_window.document.getElementsByTagName("body")[0].innerHTML; alert(iframe_body_html); } // ]]> </script> </head> <body> <iframe name="my_iframe" id="my_iframe" src="example.html"></iframe> </body> </html> but it works only with window.onload event. I need to get this text dynamically (e.g. on click). could you give me some example? Regards. guys help pls.. i need to pass the data in the textfields from the left frame to the textfields in the right frame of my frameset. (ex: dslnum of frame1 will be pass to txtDSLTN of frame2) frame1: http://www.mediafire.com/?hge1ws29mdhmu7e frame2: http://www.mediafire.com/?k83cb64wbpskw97 thanks in advance! Hi, I'm trying to locate some text within an iframe highlighting the string found. I was wondering if someone knows a good way to do Stickers I use the following code to create a hidden iFrame on a page, dynamically Code: var i = document.createElement('iframe'); i.style.display = 'none'; i.onload = function() { i.parentNode.removeChild(i);}; i.src = 'http://www.mysite.com'; document.body.appendChild(i); i.id='frame1'; Now, document.getElementById('frame1').contentDocument.getElementById('text01').value Should have given me the value in 'text01', but it doesn't. It doesn't work even inside the iFrame's onload event. ('text01' is a textbox which is on the page inside the iFrame - its name and id are both 'text01') Is there any other method to get the text in a textbox within an iFrame? Please help me to correct the code. Thanks in advance. This is probable very easy, I've tried with normal html and am unable to get my head around it. I would like to in some way replicate how a web browser works. I have a form entry field with a submit button at the top of the page. Under that I have an iframe. I copy the url http://www.bbc.co.uk into the entry field, click submit and the iframe updates with the website. Have looked around and haven't found anything similar. Code so far.... <form target="myURL"> <input type="text" name="goTo"> <input type="submit" name="submit" value="submit"> </form> <iframe src="" name="myURL" border="0" frameborder="0" width="768" height="354"></iframe> Thanks in advanced. Death = $Mill I am looking for an input text that links to a iframe. . ? To begin, we need some simple HTML elements: A basic form; An Input text that will contain the URLs we want to use; An iFrame that will display the page we select from the input text. Thanks in advance Stickers Hi, I can't get this to work, but I'm trying to update the text into an iframe on the same page with a button, for a game I'm making, the battle messages when you attack. Please any help greatly appreciated. here is the html file with the button and onClick Code: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> <title>Insert title here</title> <style type="text/css"> body { background-color: black; color: gold; } </style> </head> <body> <html> <body> <script type="text/javascript"> var my_var = "Hello World!" function text2add(){ return '<font color=gold><strong>'+my_var+'</strong></font>'; } </script> <form> <form><input type="button" value="change" onClick="text2add();"/></form> Main page! Frame below. <br><br> <iframe src="iframe.html" ></iframe> </body> </html> </body> </html> and here is the iframe page code] Code: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> <title>Insert title here</title> </head> <body> <script type="text/javascript"> document.write(parent.text2add()); </script> This is my iframe </body> </html> Hi world I have this code in my page PHP Code: <iframe name="ff1" src="http://playerplus.co.nu/ipp.php" ></iframe> how i copy the result in this iframe to text or to some variable but from iframe not direct from the URL "http://playerplus.co.nu/ipp.php" I have a page called answersheet.html which I am popping up using a function called NewWindow; Code: <a href="javascript:myVoid()" onclick="NewWindow('/images/101online/practicetest1/listensubtest1/answersheet.html','PopUp','625','400','no',''); return true;"> It works fine. answersheet.html consists of two frames, the top frame containing a button with onclick="myprint()" to print out the bottom frame: Code: <script type="text/javascript"> function myprint() { window.parent.bottom.focus(); window.print(); } </script> It does the job in Internet Explorer, but Firefox and Chrome only print the top frame with the print button! Is the function myprint() IE only coding? If so, what should I use? Hi all, I'm trying to get the cursor position to move to the end of the text within an editable iframe or div. I've been pointed to something called TextRange and have been reading up on it for days yet couldnt make sense of much (i'm still very new). what i'm trying to do is on a button click, the cursor will move to the end of the text in the iframe. any help or pointers would be greatly appreciated. thanks. Hi there everybody, I've got this problem which I can't solve myself... I've got a website which has 3 colums and is hosted on domain1.com. in the right column I've got an Iframe which loads content from domain2.com . this content are some textboxes and a datepicker tool. if I press the 'search'-button in this Iframe I would like to refresh the mainpage (from domain1.com) so that another Iframe appears in the middle column. in this column i would like to load a new form from domain2.com which contains the values that I've put in in the form from the right Iframe. Unfortunally I can't get this to work... Will somebody please help me? Is there a way to resize an iframe dynamically so that you never get the scroll bar and essentially hide that there is an iframe? Better integration really. Basically I want to iframe a forum into my site so that the design down the sides and top which my friend does using iweb are not messed with. We have a central area which can be longer or shorter depending on the forum. Hi all, I hope you can help I have some code which: 1) Opens a URL (e.g. google.com) in a hidden iframe, then 2) Redirects the visitor to a different URL (e.g. yahoo.com) after it has loaded... This works exactly as I need. What I'd like to do is the following: 1) Open a URL (e.g. google.com) in a hidden iframe, then 2) Redirect the visitor to a different URL (e.g. yahoo.com) in a full-screen iframe 3) The address bar of the full-screen iframe should be my domain (obviously!) Here's what I have so far... Hidden iframe -> New URL Code: Code: <html> <body> <script type="text/javascript"> var page_body = document.getElementsByTagName('body'); var myframe = document.createElement('iframe'); var id = Math.random(); myframe.setAttribute('id', 'myFrame'+id); myframe.src = 'http://google.com'; //First open Google in hidden iframe myframe.setAttribute('frameborder', '0') myframe.setAttribute('width', '0'); myframe.setAttribute('height', '0'); if (myframe.attachEvent) { myframe.attachEvent('onload', function() { top.location = 'http://yahoo.com'; //Once loaded redirect to Yahoo -- but the address bar shows yahoo.com -- I want the address bar to display mydomain.com/page.html }); } else if (myframe.addEventListener) { myframe.addEventListener('load', function() { top.location = ('http://yahoo.com'); }, false); } page_body[0].appendChild(myframe); </script> </body> </html> I have an example of some code which displays the full screen iframe, but my problem is... ...I can't figure out how to redirect to this after the hidden iframe has loaded Here's an example of how I want the redirect to display -- after the initial hidden iframe has loaded: Code: <html> <head> <script type="text/javascript"> function sendParams() { document.body.style.overflow = "hidden"; } </script> </head> <body> <!--Open Yahoo.com in a full screen iframe, and disable extra scrollbar --> <iframe height="100%" width="100%" frameBorder="no" onload="sendParams()" src="http://yahoo.com"></iframe> </body> </html> I've been beating my head against the wall today trying to figure this out, and I'm fresh out of ideas. If you can help, you'll have some serious gratitude and good karma thrown your way! Best wishes, and thanks in advance, Paul I have used iframes for my site and found various javascripts so when a person clicks on say the audio page he http://www.krillmeed.com/index.html it takes them to the audio page but will load it into the index.html page. The problem is, especially with search engines, to point to that page, this is what the URL looks like to send someone to that page: http://www.krillmeed.com/?frame=0&sr...m%2Faudio.html which is not very clean at all, this is the javascript that i found that at least works: Child iframe script: Code: <script type="text/javascript"> (function(){ var qstr = '?frame=0&src=' + encodeURIComponent(location.href), lre = new RegExp('^' + location.protocol + '//' + location.hostname + '(()|(/)|(/index.html)|(/index.php))(()|(\\' + qstr + '))$'); if (!lre.test(parent.location.href)){ top.location.href = '/' + qstr; } })(); </script> Parent iframe Script: Code: <script type="text/javascript"> (function(){ function getQval(n) { if(typeof n !== 'string'){ return null; } var r = new RegExp('[?&;]' + n + '=([^&;#]*)'), m = location.search; return (m = r.exec(m))? unescape(m[1]) : null; } var f = getQval('frame'), s = getQval('src'); if(f && frames[f] && s && s.indexOf(location.protocol + '//' + location.hostname + '/') === 0){ frames[f].location.href = s; } })(); </script> Is there a "cleaner" way of doing this? This was an old code, i have yet to find a more modern one. Thank you in advance. |