jquery - Modify html within Iframe, using the users input -
i have html page within iframe on page. main page has text area user change title text on page inside of iframe. trying have user able enter title wants in text area, , have input displayed in iframe html code. don't know how use take user input 1 page, , input page. on how or point in right direction helpful
the easiest way pass query string parameter page 1 , reload source of iframe used inside it. on other page, query string parameter , use change property of html element.
here's sample code :
page 1 :
<!doctype html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script> </head> <body> <h2>this page 1</h2> <input type="text" onchange="changetext(this);" /> <iframe id="ifrm1" src="htmlpage2.html"></iframe> <script type="text/javascript"> var originalurl; $().ready(function () { originalurl = $("#ifrm1").attr("src"); }); function changetext(obj) { $("#ifrm1").attr("src", originalurl + "?text=" + obj.value); } </script> </body> </html> page 2 :
<!doctype html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script> </head> <body> <h2>this page 2</h2> <input type="text" id="txt1" /> <script type="text/javascript"> $().ready(function () { var gettext = getparameterbyname("text"); $("#txt1").val(gettext); }); function getparameterbyname(name) { name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]"); var regex = new regexp("[\\?&]" + name + "=([^&#]*)"), results = regex.exec(location.search); return results == null ? "" : decodeuricomponent(results[1].replace(/\+/g, " ")); } </script> </body> </html> hope helps.
Comments
Post a Comment