+ 1
Need helpblending two codes...javascript/jQuery...live typing to an iframe.
Basically i am having trouble live typing into an iframe.... i can live type to a text area within the same page...but as i mentioned i need to live type to an iframe... previously i was clicking text to the iframe, but now i need to get rid of the button and have all text go in automatically; have it show up immediately on the iframe...please help... below i will place twp different codes so ypu guys can see, and perhaps have something to work from...help!
10 Respuestas
+ 1
He Ma
Referring to your first code snippet if you remove the button tags and use the oninput event inside of the textarea tag should solve your problem.
<body>
<textarea rows="5" cols="50" oninput="updateIframe()" placeholder="Type HTML or text here..."></textarea>
<iframe id="myframe"></iframe>
</body>
https://www.w3schools.com/jsref/event_oninput.asp
+ 1
Thank you so much!!!!!!!!!!!
+ 1
I broke my head for about a week over this... thank you, thank you!!!!!!! 😁
0
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery Inserting Textarea Value into an iFrame</title>
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<style>
textarea, iframe{
display: block;
margin: 10px 0;
}
iframe{
width: 500px;
border: 1px solid #a9a9a9;
}
</style>
<script>
function updateIframe(){
var myFrame = $("#myframe").contents().find('body');
var textareaValue = $("textarea").val();
myFrame.html(textareaValue);
}
</script>
</head>
<body>
<textarea rows="5" cols="50" placeholder="Type HTML or text here..."></textarea>
<button type="button" onclick="updateIframe()">Insert Content</button>
<iframe id="myframe"></iframe>
</body>
</html>
0
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery Insert Text Into Div from the Textarea</title>
<style>
.output{
padding: 10px;
min-height: 50px;
margin: 20px 0;
background-color: #f1f1f1;
border: 1px solid #e4e4e4;
}
</style>
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script>
$(document).ready(function(){
$("#myTextarea").keyup(function(){
// Getting the current value of textarea
var currentText = $(this).val();
// Setting the Div content
$(".output").text(currentText);
});
});
</script>
</head>
<body>
<form>
<textarea id="myTextarea" rows="5" cols="60" placeholder="Type something here..."></textarea>
</form>
<div class="output"></div>
</body>
</html>
0
you are welcome
0
I am sorry to bring up this question again... but i ran into another problem while working with this code, because i ended up putting two iframes side to side ...basically two iframes within the parent page... on the left side i have my iframe with the text input field and on the rightside i have my other iframe where the inputted text is showing up... where i am having trouble is basically the DOM because unlike before where i was having input to iframe within the parent html.... now i have parent html split halfway equally housing two iframes which are to be communicating.... so i have the left talking to parent for parent to talk to right iframe??? So i must give both iframes id's and ...im lost... if you understand my issue pls help...
0
My understanding is... i have to create a manager object on the window of the parent frame....
Window.mgmt = {
Frame1: $('iframe#frame1')
Frame2: $('iframe#frame2')
}
Then in either of the two frames i should be able to access that object using
Window.parent.mgmt.frame1 ....
0
Basically i ended up putting my textarea input field within an iframe of its own... to output the text to another iframe to the side of it...
0
Im lost because i tried the window mgmt on the parent page then calling it with the window.parent.mgmt....but im challenged...
¿Tienes a menudo preguntas como esta?
Aprende gratis de forma más eficaz
En tendencia hoy
Javascript
3 Votes
Please Modify My Code
1 Votes
Why text takes time to load
1 Votes
Digital currency
1 Votes