Iframe bij form
Mijn klant heeft een iframe waarin 2 textareas staan, 1 textarea in javascript staat, en de ander gewoon in HTML die hij vervolgens vernieuwd via javascript. Het is namelijk een HTML editor.
Het probleem is dat hij de gegevens die in textarea 1 wil kunnen opslaan. Mijn probleem is hoe kom ik nou bij de content van textarea 1 om vervolgens die op te slaan.
Edit: Het gaat hier om regel 32, in dat bestand staan de textareas.
Hoe kan ik dit het beste oplossen?
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
<?php include '../html/includes/data_compleet.php'; ?>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Editor - HTML verwerker</title>
<link href="http://www.google.nl/intl/nl/services/css/default.css" rel="stylesheet"> <!-- Blauwe button -->
<link href="style.css" rel="stylesheet"> <!-- Medals en gewone CSS -->
<script>
<!--
if (window!= top)
top.location.href=location.href
// -->
</script> <!-- Anti-iframe script -->
</head>
<body onload="begin('tec/begin.html'); return false;" class="icoMr">
<div style="position:absolute; margin:.8em; bottom:0em; right:0em; font-family:verdana;font-size:13px;">
<a style="margin-top:20px;" class="maia-button" data-g-action="Editor" data-g-event="Editor" data-g-label="Editor" href="#" onclick="forum('forum/index.php'); return false;">Forum</a>
<?php
if(isset($_SESSION['user_id']) === true) {
echo '<a style="margin-top:20px; margin-right: 3px; " class="maia-button" data-g-action="Editor" data-g-event="Editor" data-g-label="Editor" href="#" onclick="account(\'ingelogt/welkomscreen.php\'); return false;">Account</a>';
echo '<a href="ingelogt/logout.php" class="maia-button">Log uit</a>';
} else {
echo '<a style="margin-top:20px; margin-right: 3px; " class="maia-button" data-g-action="Editor" data-g-event="Editor" data-g-label="Editor" href="#" onclick="account(\'account/login.php\'); return false;">Login</a>';
}
?>
</div>
<iframe name="c" src="tec/converter.html" frameborder="0" marginheight="0" marginwidth="0" width="100%" height="90%" scrolling="auto"></iframe>
<script type="text/javascript" lang="javascript" src="http://deseloper.org/examples/modal-simple/jquery-1.2.3.js"></script>
<script type="text/javascript" lang="javascript" src="http://deseloper.org/examples/modal-simple/modal-window.js"></script>
<script type="text/javascript" lang="javascript">
var begin = function(source)
{
modalWindow.windowId = "begin";
modalWindow.width = 700;
modalWindow.height = 400;
modalWindow.content = "<iframe width='700' height='400' frameborder='0' scrolling='no' src='" + source + "'></iframe>";
modalWindow.open();
};
var forum = function(source)
{
modalWindow.windowId = "forum";
modalWindow.width = 900;
modalWindow.height = 500;
modalWindow.content = "<iframe width='900' height='600' frameborder='0' scrolling='no' src='" + source + "'></iframe>";
modalWindow.open();
};
var account = function(source)
{
modalWindow.windowId = "account";
modalWindow.width = 600;
modalWindow.height = 400;
modalWindow.content = "<iframe width='600' height='400' frameborder='0' scrolling='no' src='" + source + "'></iframe>";
modalWindow.open();
};
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Editor - HTML verwerker</title>
<link href="http://www.google.nl/intl/nl/services/css/default.css" rel="stylesheet"> <!-- Blauwe button -->
<link href="style.css" rel="stylesheet"> <!-- Medals en gewone CSS -->
<script>
<!--
if (window!= top)
top.location.href=location.href
// -->
</script> <!-- Anti-iframe script -->
</head>
<body onload="begin('tec/begin.html'); return false;" class="icoMr">
<div style="position:absolute; margin:.8em; bottom:0em; right:0em; font-family:verdana;font-size:13px;">
<a style="margin-top:20px;" class="maia-button" data-g-action="Editor" data-g-event="Editor" data-g-label="Editor" href="#" onclick="forum('forum/index.php'); return false;">Forum</a>
<?php
if(isset($_SESSION['user_id']) === true) {
echo '<a style="margin-top:20px; margin-right: 3px; " class="maia-button" data-g-action="Editor" data-g-event="Editor" data-g-label="Editor" href="#" onclick="account(\'ingelogt/welkomscreen.php\'); return false;">Account</a>';
echo '<a href="ingelogt/logout.php" class="maia-button">Log uit</a>';
} else {
echo '<a style="margin-top:20px; margin-right: 3px; " class="maia-button" data-g-action="Editor" data-g-event="Editor" data-g-label="Editor" href="#" onclick="account(\'account/login.php\'); return false;">Login</a>';
}
?>
</div>
<iframe name="c" src="tec/converter.html" frameborder="0" marginheight="0" marginwidth="0" width="100%" height="90%" scrolling="auto"></iframe>
<script type="text/javascript" lang="javascript" src="http://deseloper.org/examples/modal-simple/jquery-1.2.3.js"></script>
<script type="text/javascript" lang="javascript" src="http://deseloper.org/examples/modal-simple/modal-window.js"></script>
<script type="text/javascript" lang="javascript">
var begin = function(source)
{
modalWindow.windowId = "begin";
modalWindow.width = 700;
modalWindow.height = 400;
modalWindow.content = "<iframe width='700' height='400' frameborder='0' scrolling='no' src='" + source + "'></iframe>";
modalWindow.open();
};
var forum = function(source)
{
modalWindow.windowId = "forum";
modalWindow.width = 900;
modalWindow.height = 500;
modalWindow.content = "<iframe width='900' height='600' frameborder='0' scrolling='no' src='" + source + "'></iframe>";
modalWindow.open();
};
var account = function(source)
{
modalWindow.windowId = "account";
modalWindow.width = 600;
modalWindow.height = 400;
modalWindow.content = "<iframe width='600' height='400' frameborder='0' scrolling='no' src='" + source + "'></iframe>";
modalWindow.open();
};
</script>
</body>
</html>
Eidt: Het gaat hier om regel
Gewijzigd op 02/04/2013 16:22:55 door Landleven Tips
http://corpocrat.com/2008/07/28/iframe-innerhtml-value-from-textarea/
Ik zal er eens naar kijken. Dit wordt dan wel helaas morgen.
Gewijzigd op 02/04/2013 16:27:19 door Landleven Tips
maar in het algemeen:
geef het element (in dit geval de textarea een uniek id: <textarea id="invoerveld">
en dan kun je zo het element benaderen en de content er uit vissen:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<html>
<head>
<script>
window.onload = function() {
var textarea = document.getElementById('invoerveld');
alert(textarea.innerHTML);
var invoerveld = document.getElementById('textinput');
alert(invoerveld.value);
}
</script>
</head>
<body>
<textarea id="invoerveld">bananen</textarea><br/>
<input type="text" id="textinput" value="appels" />
</body>
</html>
<head>
<script>
window.onload = function() {
var textarea = document.getElementById('invoerveld');
alert(textarea.innerHTML);
var invoerveld = document.getElementById('textinput');
alert(invoerveld.value);
}
</script>
</head>
<body>
<textarea id="invoerveld">bananen</textarea><br/>
<input type="text" id="textinput" value="appels" />
</body>
</html>
Gewijzigd op 02/04/2013 18:47:52 door Frank Nietbelangrijk
Die code was ik inderdaad vergeten te posten. Hieronder staat hij dan:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
<!DOCTYPE html>
<html>
<head>
<title>Editor</title>
<!-- COPYRIGHT EDITOR 2013 - NIETS MAG GEKOPIERD WORDEN ZONDER TOESTEMMING. -->
<script type="text/javascript">
var editboxHTML =
'<html class="expand close">' +
'<head>' +
'<style type="text/css">' +
'.expand { width: 100%; height: 100%; }' +
'.close { border: none; margin: 0px; padding: 0px; }' +
'html,body { overflow: hidden; }' +
'</style>' +
'</head>' +
'<body class="expand close" onload="document.f.ta.focus(); document.f.ta.select();">' +
'<form class="expand close" name="f">' +
'<textarea class="expand close" style="background: #FFF;" name="ta" wrap="hard" spellcheck="false">' +
'</textarea>' +
'</form>' +
'</body>' +
'</html>';
var defaultStuff = 'Type hier uw HTML code of maak er een.';
var extraStuff = '';
var old = '';
function init()
{
window.editbox.document.write(editboxHTML);
window.editbox.document.close();
window.editbox.document.f.ta.value = defaultStuff;
update();
}
function update()
{
var textarea = window.editbox.document.f.ta;
var d = dynamicframe.document;
if (old != textarea.value) {
old = textarea.value;
d.open();
d.write(old);
if (old.replace(/[rn]/g,'') == defaultStuff.replace(/[rn]/g,''))
d.write(extraStuff);
d.close();
}
window.setTimeout(update, 150);
}
</script>
</head>
<frameset resizable="yes" rows="50%,*" onload="init();">
<frame name="editbox" src="javascript:'';">
<frame name="dynamicframe" src="javascript:'';">
</frameset>
</html>
<html>
<head>
<title>Editor</title>
<!-- COPYRIGHT EDITOR 2013 - NIETS MAG GEKOPIERD WORDEN ZONDER TOESTEMMING. -->
<script type="text/javascript">
var editboxHTML =
'<html class="expand close">' +
'<head>' +
'<style type="text/css">' +
'.expand { width: 100%; height: 100%; }' +
'.close { border: none; margin: 0px; padding: 0px; }' +
'html,body { overflow: hidden; }' +
'</style>' +
'</head>' +
'<body class="expand close" onload="document.f.ta.focus(); document.f.ta.select();">' +
'<form class="expand close" name="f">' +
'<textarea class="expand close" style="background: #FFF;" name="ta" wrap="hard" spellcheck="false">' +
'</textarea>' +
'</form>' +
'</body>' +
'</html>';
var defaultStuff = 'Type hier uw HTML code of maak er een.';
var extraStuff = '';
var old = '';
function init()
{
window.editbox.document.write(editboxHTML);
window.editbox.document.close();
window.editbox.document.f.ta.value = defaultStuff;
update();
}
function update()
{
var textarea = window.editbox.document.f.ta;
var d = dynamicframe.document;
if (old != textarea.value) {
old = textarea.value;
d.open();
d.write(old);
if (old.replace(/[rn]/g,'') == defaultStuff.replace(/[rn]/g,''))
d.write(extraStuff);
d.close();
}
window.setTimeout(update, 150);
}
</script>
</head>
<frameset resizable="yes" rows="50%,*" onload="init();">
<frame name="editbox" src="javascript:'';">
<frame name="dynamicframe" src="javascript:'';">
</frameset>
</html>
Het probleem is dat de inhoud in de editboxHTML moet worden opgeslagen. Dit bestand wordt in een iframe gezet zoals bij regel 34 te zien is bij mij 1ste reactie.
Ik heb het geprobeert met jullie voorbeelden maar dit gaf niet het gewenste resultaat. De tekst die in de editboxHTML staat moet namelijk kunnen worden opgeslagen via PHP in het script van mij 1ste reactie. Daar zit het probleem.
Ik hoop dat dit voldoende informatie is.
Gewijzigd op 03/04/2013 09:59:06 door Landleven Tips
Antwoord hoe het wel kan staat hier: http://stackoverflow.com/questions/1088544/javascript-get-element-from-within-an-iframe#
Ik heb het toegepast in mij script en vervolgens in een alert gezet. Het probleem is dat ik geen alert krijg, kunt u vinden waardoor? Ik in de editboxHTML de textarea het id gegeven: 'textareainhoud'.
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
<?php include '../html/includes/data_compleet.php'; ?>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Editor - HTML verwerker</title>
<link href="http://www.google.nl/intl/nl/services/css/default.css" rel="stylesheet"> <!-- Blauwe button -->
<link href="style.css" rel="stylesheet"> <!-- Medals en gewone CSS -->
<script>
<!--
if (window!= top)
top.location.href=location.href
// -->
</script> <!-- Anti-iframe script -->
</head>
<body onload="begin('tec/begin.html'); return false;" class="icoMr">
<div style="position:absolute; margin:.8em; bottom:0em; right:0em; font-family:verdana;font-size:13px;">
<a style="margin-top:20px;" class="maia-button" data-g-action="Editor" data-g-event="Editor" data-g-label="Editor" href="#" onclick="forum('forum/index.php'); return false;">Forum</a>
<?php
if(isset($_SESSION['user_id']) === true) {
echo '<a style="margin-top:20px; margin-right: 3px; " class="maia-button" data-g-action="Editor" data-g-event="Editor" data-g-label="Editor" href="#" onclick="account(\'ingelogt/welkomscreen.php\'); return false;">Account</a>';
echo '<a href="ingelogt/logout.php" class="maia-button">Log uit</a>';
} else {
echo '<a style="margin-top:20px; margin-right: 3px; " class="maia-button" data-g-action="Editor" data-g-event="Editor" data-g-label="Editor" href="#" onclick="account(\'account/login.php\'); return false;">Login</a>';
}
?>
</div>
<iframe name="c" src="tec/converter.html" frameborder="0" marginheight="0" marginwidth="0" width="100%" height="90%" scrolling="auto" id="iframewindow"></iframe>
<script type="text/javascript">
var iframe = document.getElementById('iframewindow');
var innerDoc = iframe.contentDocument || iframe.contentWindow.document;
var testge innerDoc.getElementById('textareainhoud').value;
alert(testge);
</script>
<script type="text/javascript" lang="javascript" src="http://deseloper.org/examples/modal-simple/jquery-1.2.3.js"></script>
<script type="text/javascript" lang="javascript" src="http://deseloper.org/examples/modal-simple/modal-window.js"></script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Editor - HTML verwerker</title>
<link href="http://www.google.nl/intl/nl/services/css/default.css" rel="stylesheet"> <!-- Blauwe button -->
<link href="style.css" rel="stylesheet"> <!-- Medals en gewone CSS -->
<script>
<!--
if (window!= top)
top.location.href=location.href
// -->
</script> <!-- Anti-iframe script -->
</head>
<body onload="begin('tec/begin.html'); return false;" class="icoMr">
<div style="position:absolute; margin:.8em; bottom:0em; right:0em; font-family:verdana;font-size:13px;">
<a style="margin-top:20px;" class="maia-button" data-g-action="Editor" data-g-event="Editor" data-g-label="Editor" href="#" onclick="forum('forum/index.php'); return false;">Forum</a>
<?php
if(isset($_SESSION['user_id']) === true) {
echo '<a style="margin-top:20px; margin-right: 3px; " class="maia-button" data-g-action="Editor" data-g-event="Editor" data-g-label="Editor" href="#" onclick="account(\'ingelogt/welkomscreen.php\'); return false;">Account</a>';
echo '<a href="ingelogt/logout.php" class="maia-button">Log uit</a>';
} else {
echo '<a style="margin-top:20px; margin-right: 3px; " class="maia-button" data-g-action="Editor" data-g-event="Editor" data-g-label="Editor" href="#" onclick="account(\'account/login.php\'); return false;">Login</a>';
}
?>
</div>
<iframe name="c" src="tec/converter.html" frameborder="0" marginheight="0" marginwidth="0" width="100%" height="90%" scrolling="auto" id="iframewindow"></iframe>
<script type="text/javascript">
var iframe = document.getElementById('iframewindow');
var innerDoc = iframe.contentDocument || iframe.contentWindow.document;
var testge innerDoc.getElementById('textareainhoud').value;
alert(testge);
</script>
<script type="text/javascript" lang="javascript" src="http://deseloper.org/examples/modal-simple/jquery-1.2.3.js"></script>
<script type="text/javascript" lang="javascript" src="http://deseloper.org/examples/modal-simple/modal-window.js"></script>
</body>
</html>
Gewijzigd op 03/04/2013 10:35:31 door Landleven Tips
Quote:
var testge innerDoc.getElementById('textareainhoud').value;
Misschien nog even een = teken tussen?
Code (php)
1
var testge = innerDoc.getElementById('textareainhoud').value;
Nu krijg ik wel een alert alleen krijg ik null wat betekent dat het element leeg is. De javascript code is geworden:
Code (php)
1
2
3
4
5
6
7
2
3
4
5
6
7
<script type="text/javascript">
var iframe = document.getElementById('iframewindow');
var innerDoc = iframe.contentDocument || iframe.contentWindow.document;
var testge = innerDoc.getElementById('textareainhoud');
alert(testge);
</script>
var iframe = document.getElementById('iframewindow');
var innerDoc = iframe.contentDocument || iframe.contentWindow.document;
var testge = innerDoc.getElementById('textareainhoud');
alert(testge);
</script>
Als ik achter de textareainhoud .value zet krijg ik namelijk geen alert meer..
Ik zou het op prijs stellen, als u mij wilt helpen ben namelijk niet goed in javascript maar meer in PHP.
De reden dat er geen element gevonden kan worden is simpelweg omdat je helemaal geen id hebt gegeven aan je textarea (en dus zeker niet het id 'textareainhoud'). Dat zal je dus nog even moeten doen.
Dit heb ik degelijk gedaan. Hieronder nogmaals convert.html (een deel ervan)
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
<script type="text/javascript">
var editboxHTML =
'<html class="expand close">' +
'<head>' +
'<style type="text/css">' +
'.expand { width: 100%; height: 100%; }' +
'.close { border: none; margin: 0px; padding: 0px; }' +
'html,body { overflow: hidden; }' +
'</style>' +
'</head>' +
'<body class="expand close" onload="document.f.ta.focus(); document.f.ta.select();" id="body">' +
'<form class="expand close" name="f">' +
'<textarea id="textareainhoud" style="background: #FFF; width: 100% height: 100%; border: none; margin 0px; padding: 0px;" name="ta" wrap="hard" spellcheck="false">' +
'</textarea>' +
'</form>' +
'</body>' +
'</html>';
var defaultStuff = 'Type hier uw HTML code of maak er een.';
var extraStuff = '';
var old = '';
function init() {
window.editbox.document.write(editboxHTML);
window.editbox.document.close();
window.editbox.document.f.ta.value = defaultStuff;
update();
}
var editboxHTML =
'<html class="expand close">' +
'<head>' +
'<style type="text/css">' +
'.expand { width: 100%; height: 100%; }' +
'.close { border: none; margin: 0px; padding: 0px; }' +
'html,body { overflow: hidden; }' +
'</style>' +
'</head>' +
'<body class="expand close" onload="document.f.ta.focus(); document.f.ta.select();" id="body">' +
'<form class="expand close" name="f">' +
'<textarea id="textareainhoud" style="background: #FFF; width: 100% height: 100%; border: none; margin 0px; padding: 0px;" name="ta" wrap="hard" spellcheck="false">' +
'</textarea>' +
'</form>' +
'</body>' +
'</html>';
var defaultStuff = 'Type hier uw HTML code of maak er een.';
var extraStuff = '';
var old = '';
function init() {
window.editbox.document.write(editboxHTML);
window.editbox.document.close();
window.editbox.document.f.ta.value = defaultStuff;
update();
}
Ik heb ook al gekeken of de id's kloppen met elkaar. En dat klopt. Waardoor komt het dat er null uitkomt?
Edit: Als ik er editboxHTML bij zet komt er ook geen alert.
Gewijzigd op 03/04/2013 11:47:59 door Landleven Tips
Je zal dus moeten wachten tot de iframe inhoud volledig geladen is voor je dat textarea kan aanroepen. Als je de code vanuit een onclick van een button aanroept zal het waarschijnlijk wel werken.
Ik heb het nu in een kleine functie gemaakt en vervolgens met een <button></button> (even voor de test) verbonden. Helaas krijg ik dan alsnog dezelfde melding namelijk null. Ik vermoed dat ik de klant teleur moet stellen, door te zeggen dat het niet kan. Of iemand anders moet nog een idee hebben wat misschien zou werken.
In ieder geval bedankt voor het helpen!
hieronder nogmaals de code:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
<?php include '../Editor_Woelmuis/includes/data_compleet.php'; ?>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Editor - HTML verwerker</title>
<link href="http://www.google.nl/intl/nl/services/css/default.css" rel="stylesheet"> <!-- Blauwe button -->
<link href="style.css" rel="stylesheet"> <!-- Medals en gewone CSS -->
<script>
<!--
if (window!= top)
top.location.href=location.href
// -->
</script> <!-- Anti-iframe script -->
<script type="text/javascript">
function iframecontent() {
var iframe = document.getElementById('iframewindow');
var innerDoc = iframe.contentDocument || iframe.contentWindow.document;
var testge = innerDoc.getElementById('textareainhoud');
alert(testge);
};
</script>
</head>
<body onload="begin('tec/begin.html'); return false; " class="icoMr">
<div style="position:absolute; margin:.8em; bottom:0em; right:0em; font-family:verdana;font-size:13px;">
<a style="margin-top:20px;" class="maia-button" data-g-action="Editor" data-g-event="Editor" data-g-label="Editor" href="#" onclick="forum('forum/index.php'); return false;">Forum</a>
<?php
if(isset($_SESSION['user_id']) === true) {
echo '<a style="margin-top:20px; margin-right: 3px; " class="maia-button" data-g-action="Editor" data-g-event="Editor" data-g-label="Editor" href="#" onclick="account(\'ingelogt/welkomscreen.php\'); return false;">Account</a>';
echo '<a href="ingelogt/logout.php" class="maia-button">Log uit</a>';
} else {
echo '<a style="margin-top:20px; margin-right: 3px; " class="maia-button" data-g-action="Editor" data-g-event="Editor" data-g-label="Editor" href="#" onclick="account(\'account/login.php\'); return false;">Login</a>';
}
?>
</div>
<iframe name="c" src="tec/converter.html" frameborder="0" marginheight="0" marginwidth="0" width="100%" height="90%" scrolling="auto" id="iframewindow"></iframe>
<button onclick="iframecontent();" value="Laad javascript">Testerdetest</button>
<script type="text/javascript" lang="javascript" src="http://deseloper.org/examples/modal-simple/jquery-1.2.3.js"></script>
<script type="text/javascript" lang="javascript" src="http://deseloper.org/examples/modal-simple/modal-window.js"></script>
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Editor - HTML verwerker</title>
<link href="http://www.google.nl/intl/nl/services/css/default.css" rel="stylesheet"> <!-- Blauwe button -->
<link href="style.css" rel="stylesheet"> <!-- Medals en gewone CSS -->
<script>
<!--
if (window!= top)
top.location.href=location.href
// -->
</script> <!-- Anti-iframe script -->
<script type="text/javascript">
function iframecontent() {
var iframe = document.getElementById('iframewindow');
var innerDoc = iframe.contentDocument || iframe.contentWindow.document;
var testge = innerDoc.getElementById('textareainhoud');
alert(testge);
};
</script>
</head>
<body onload="begin('tec/begin.html'); return false; " class="icoMr">
<div style="position:absolute; margin:.8em; bottom:0em; right:0em; font-family:verdana;font-size:13px;">
<a style="margin-top:20px;" class="maia-button" data-g-action="Editor" data-g-event="Editor" data-g-label="Editor" href="#" onclick="forum('forum/index.php'); return false;">Forum</a>
<?php
if(isset($_SESSION['user_id']) === true) {
echo '<a style="margin-top:20px; margin-right: 3px; " class="maia-button" data-g-action="Editor" data-g-event="Editor" data-g-label="Editor" href="#" onclick="account(\'ingelogt/welkomscreen.php\'); return false;">Account</a>';
echo '<a href="ingelogt/logout.php" class="maia-button">Log uit</a>';
} else {
echo '<a style="margin-top:20px; margin-right: 3px; " class="maia-button" data-g-action="Editor" data-g-event="Editor" data-g-label="Editor" href="#" onclick="account(\'account/login.php\'); return false;">Login</a>';
}
?>
</div>
<iframe name="c" src="tec/converter.html" frameborder="0" marginheight="0" marginwidth="0" width="100%" height="90%" scrolling="auto" id="iframewindow"></iframe>
<button onclick="iframecontent();" value="Laad javascript">Testerdetest</button>
<script type="text/javascript" lang="javascript" src="http://deseloper.org/examples/modal-simple/jquery-1.2.3.js"></script>
<script type="text/javascript" lang="javascript" src="http://deseloper.org/examples/modal-simple/modal-window.js"></script>
</script>
</body>
</html>
Gewijzigd op 03/04/2013 13:24:22 door Landleven Tips
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<html>
<head>
<script type="text/javascript">
function iframecontent() {
var iframe = document.getElementById('iframe_test');
var innerDoc = iframe.contentDocument || iframe.contentWindow.document;
var testge = innerDoc.getElementById('iframe_textarea').value;
alert(testge);
}
</script>
</head>
<body>
<iframe src="iframe_test_child.html" id="iframe_test"></iframe>
<input type="submit" onclick="iframecontent();" value="click me">
</body>
</html>
<head>
<script type="text/javascript">
function iframecontent() {
var iframe = document.getElementById('iframe_test');
var innerDoc = iframe.contentDocument || iframe.contentWindow.document;
var testge = innerDoc.getElementById('iframe_textarea').value;
alert(testge);
}
</script>
</head>
<body>
<iframe src="iframe_test_child.html" id="iframe_test"></iframe>
<input type="submit" onclick="iframecontent();" value="click me">
</body>
</html>
Pagina in het iframe ("iframe_test_child.html"):
Code (php)
1
<textarea id="iframe_textarea">bla bla bla</textarea>
Laad de eerste, zorg dat de tweede in de zelfde directory staat, klik op de knop en je krijgt de tekst uit het iframe.
Gewijzigd op 03/04/2013 13:26:31 door Erwin H
Dus ik moet een nieuw bestand aanmaken, met iframe_test_child.html en daarin de textarea met iframe_textarea plaatsen?