Hallo, ich baue gerade einen Konfigurtator und bin an der Fehlerbehandlung dran. Wenn ich die Funktion losgelöst probiere, klappt alles wunderbar, aber soald ich sie in meine bestehende Seite einbinde, klappt die Funktion nicht
so ****t es: (am besten den Code in den Editor kopieren JS-Funktion in Z 166 uind html in Z 302 )
Aber hier nicht:
Wenn ich es über meinen Editor (Webcon Scriptly) mit dem IE jage, kommt die Fehlermeldung, das checkBreite nicht definiert oder Null ergibt aus. Aber es kommt auch eine Fehlermeldung wegen den style :|
Es funktioniert aber auch keine alert-Box
Gruß, Kalito
so ****t es: (am besten den Code in den Editor kopieren JS-Funktion in Z 166 uind html in Z 302 )
HTML:
<html>
<head>
<script language="javascript" type="text/javascript">
function checkBreite(){
var breite = parseInt(document.getElementById("breite").value);
if(breite <= 899 || breite >=1201) document.getElementById("FehlerBreite").style.display='block';
else document.getElementById("FehlerBreite").style.display='none';
}
</script>
</head>
<body>
<div>Breite: <input type="text" name="breite" id="breite" maxlength="4" onblur="checkBreite()"/>mm (900mm - 1200mm)<span id="FehlerBreite" style="display: none;">Die angegebene Breite wird nicht geführ</span></div>
</body>
</html>
Aber hier nicht:
HTML:
<?php
include("../include/sql.php");
connection();
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<!--
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta name="description" content="Onlinshop für Fenster, Türen, Tore. Ein Fantastisches Gefühl">
<meta name="keywords" content="Fenster, Türen, Tore, Holz.Aluminium">
<meta name="language" content="de">
<meta name="robots" content="index,follow">
<meta name="author" content="Patrick Kahle">
<meta name="abstract" content="Onlineshop für Fenster, Türen, Tore">
<meta name="copyright" content="? Bauelemente Kittler">
<meta name="designer" content="Patrick Kahle">
<meta name="publisher" content="Bauelemente Kittler">
<meta name="revisit-After" content="10 days">
<meta name="distribution" content="global">
-->
<script language="JavaScript" type="text/javascript">
function CheckRadio(id) {
if (id == "modell_primus") {
document.getElementById('modell_primus').style.display = 'block';
document.getElementById('modell_vario').style.display = 'none';
document.getElementById('modell_select').style.display = 'none';
document.getElementById('modell_express').style.display = 'none';
}
if (id == "modell_vario") {
document.getElementById('modell_primus').style.display = 'none';
document.getElementById('modell_vario').style.display = 'block';
document.getElementById('modell_select').style.display = 'none';
document.getElementById('modell_express').style.display = 'none';
}
if (id == "modell_select") {
document.getElementById('modell_primus').style.display = 'none';
document.getElementById('modell_vario').style.display = 'none';
document.getElementById('modell_select').style.display = 'block';
document.getElementById('modell_express').style.display = 'none';
}
if (id == "modell_express") {
document.getElementById('modell_primus').style.display = 'none';
document.getElementById('modell_vario').style.display = 'none';
document.getElementById('modell_select').style.display = 'none';
document.getElementById('modell_express').style.display = 'block';
}
if(id == "T"){
document.getElementById('hbe').style.display = 'block';
document.getElementById('hbz').style.display = 'none';
document.getElementById('sl').style.display = 'none';
document.getElementById('sr').style.display = 'none';
document.getElementById('sl').style.display = 'none';
document.getElementById('o').style.display = 'none';
}
if(id == "TSL"){
document.getElementById('hbe').style.display = 'block';
document.getElementById('hbz').style.display = 'none';
document.getElementById('sl').style.display = 'block';
document.getElementById('sr').style.display = 'none';
document.getElementById('o').style.display = 'none';
}
if(id == "TSR"){
document.getElementById('hbe').style.display = 'block';
document.getElementById('hbz').style.display = 'none';
document.getElementById('sl').style.display = 'none';
document.getElementById('sr').style.display = 'block';
document.getElementById('o').style.display = 'none';
}
if(id == "T2S"){
document.getElementById('hbe').style.display = 'block';
document.getElementById('hbz').style.display = 'none';
document.getElementById('sl').style.display = 'block';
document.getElementById('sr').style.display = 'block';
document.getElementById('o').style.display = 'none';
}
if(id == "TO"){
document.getElementById('hbe').style.display = 'block';
document.getElementById('hbz').style.display = 'none';
document.getElementById('sl').style.display = 'none';
document.getElementById('sr').style.display = 'none';
document.getElementById('o').style.display = 'block';
}
if(id == "TSOL"){
document.getElementById('hbe').style.display = 'block';
document.getElementById('hbz').style.display = 'none';
document.getElementById('sl').style.display = 'block';
document.getElementById('sr').style.display = 'none';
document.getElementById('o').style.display = 'block';
}
if(id == "TSOR"){
document.getElementById('hbe').style.display = 'block';
document.getElementById('hbz').style.display = 'none';
document.getElementById('sl').style.display = 'none';
document.getElementById('sr').style.display = 'block';
document.getElementById('o').style.display = 'block';
}
if(id == "T2SO"){
document.getElementById('hbe').style.display = 'block';
document.getElementById('hbz').style.display = 'none';
document.getElementById('sl').style.display = 'block';
document.getElementById('sr').style.display = 'block';
document.getElementById('o').style.display = 'block';
}
if(id == "2T"){
document.getElementById('hbe').style.display = 'none';
document.getElementById('hbz').style.display = 'block';
document.getElementById('sl').style.display = 'none';
document.getElementById('sr').style.display = 'none';
document.getElementById('sl').style.display = 'none';
document.getElementById('o').style.display = 'none';
}
if(id == "2TSL"){
document.getElementById('hbe').style.display = 'none';
document.getElementById('hbz').style.display = 'block';
document.getElementById('sl').style.display = 'block';
document.getElementById('sr').style.display = 'none';
document.getElementById('o').style.display = 'none';
}
if(id == "2TSR"){
document.getElementById('hbe').style.display = 'none';
document.getElementById('hbz').style.display = 'block';
document.getElementById('sl').style.display = 'none';
document.getElementById('sr').style.display = 'block';
document.getElementById('o').style.display = 'none';
}
if(id == "2T2S"){
document.getElementById('hbe').style.display = 'none';
document.getElementById('hbz').style.display = 'block';
document.getElementById('sl').style.display = 'block';
document.getElementById('sr').style.display = 'block';
document.getElementById('o').style.display = 'none';
}
if(id == "2TO"){
document.getElementById('hbe').style.display = 'none';
document.getElementById('hbz').style.display = 'block';
document.getElementById('sl').style.display = 'none';
document.getElementById('sr').style.display = 'none';
document.getElementById('o').style.display = 'block';
}
if(id == "2TSOL"){
document.getElementById('hbe').style.display = 'none';
document.getElementById('hbz').style.display = 'block';
document.getElementById('sl').style.display = 'block';
document.getElementById('sr').style.display = 'none';
document.getElementById('o').style.display = 'block';
}
if(id == "2TSOR"){
document.getElementById('hbe').style.display = 'none';
document.getElementById('hbz').style.display = 'block';
document.getElementById('sl').style.display = 'none';
document.getElementById('sr').style.display = 'block';
document.getElementById('o').style.display = 'block';
}
if(id == "2T2SO"){
document.getElementById('hbe').style.display = 'none';
document.getElementById('hbz').style.display = 'block';
document.getElementById('sl').style.display = 'block';
document.getElementById('sr').style.display = 'block';
document.getElementById('o').style.display = 'block';
}
//Check der richtigen Eingabe der Maße beim verlassen des Feldes
}
//-->
</script>
<title>index</title>
<link href="../include/style.css" type="text/css" rel="stylesheet" />
<link href="../include/konfigurator.css" type="text/css" rel="stylesheet" />
</head>
<body>
<form method="post">
<div class="main">
<div class="header">
<div class="logo"></div>
<div class="warenkorb">
<div class="warenkorb_innen">
<?php if(isset($_POST['submit'])){
echo $_POST['bauform'];
} ?>
</div> <!-- Ende Warenkorb_innen -->
</div> <!-- Ende Warenkorb -->
<div class="clear"></div>
</div> <!-- header -->
<div class="toolbar">
<ul>
<li><a href="index.html">Startseite<!--[if gte IE 7]><!--></a><!--<![endif]--></li>
<li><a href="konfigurator/">Konfigurator<!--[if gte IE 7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="konfigurator/fenster.html">Fenster</a></li>
<li><a href="konfigurator/tueren.html">Türen</a></li>
<li><a href="konfigurator/tore.html">Tore</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li><a href="index.php?site=14">Kontakt<!--[if gte IE 7]><!--></a><!--<![endif]--></li>
<li><a href="index.php?site=14">Hilfe & Support<!--[if gte IE 7]><!--></a><!--<![endif]--></li>
<li><a href="index.php?site=14">News & Aktuelles<!--[if gte IE 7]><!--></a><!--<![endif]--></li>
</ul>
</div> <!-- Ende Toolbar -->
<div class="body">
<!-- fertiges Produkt -->
<div class="produkt">test</div>
<!-- Produktkonfigurator -->
<div class="konfigurator">
<div class="menu">
<ul>
<li><a href="#" onclick="document.getElementById('tab_1').style.display = 'block';document.getElementById('tab_2').style.display = 'none';document.getElementById('tab_3').style.display = 'none';document.getElementById('tab_4').style.display = 'none';document.getElementById('tab_5').style.display = 'none';">Modell</a></li>
<li><a href="#" onclick="document.getElementById('tab_1').style.display = 'none';document.getElementById('tab_2').style.display = 'block';document.getElementById('tab_3').style.display = 'none';document.getElementById('tab_4').style.display = 'none';document.getElementById('tab_5').style.display = 'none';">Bauform</a></li>
<li><a href="#" onclick="document.getElementById('tab_1').style.display = 'none';document.getElementById('tab_2').style.display = 'none';document.getElementById('tab_3').style.display = 'block';document.getElementById('tab_4').style.display = 'none';document.getElementById('tab_5').style.display = 'none';">Details</a></li>
<li><a href="#" onclick="document.getElementById('tab_1').style.display = 'none';document.getElementById('tab_2').style.display = 'none';document.getElementById('tab_3').style.display = 'none';document.getElementById('tab_4').style.display = 'block';document.getElementById('tab_5').style.display = 'none';">Zubehör</a></li>
</ul>
</div> <!-- Ende Menü -->
<div id="tab_1" style="display: block;">
<div>
<h1>Produktreihe</h1>
<label for="primus"><img src="../image/produktbilder/tueren/produktreihe/Primus.jpg" /></label>
<input type="radio" id="primus" style="display: none;" onclick="javascript:CheckRadio('modell_primus');"/>
<label for="vario"><img src="../image/produktbilder/tueren/produktreihe/Vario.jpg" /></label>
<input type="radio" id="vario" style="display: none;" onclick="javascript:CheckRadio('modell_vario');"/>
<label for="select"><img src="../image/produktbilder/tueren/produktreihe/Select.jpg" /></label>
<input type="radio" id="select" style="display: none;" onclick="javascript:CheckRadio('modell_select');"/>
<label for="express"><img src="../image/produktbilder/tueren/produktreihe/Express.jpg" /></label>
<input type="radio" id="express" style="display: none;" onclick="javascript:CheckRadio('modell_express');"/>
</div> <!-- Ende Produktreihe -->
<h3>Modell</h3>
<div id="modell_primus" style="display:block;">
Primus
</div>
<div id="modell_vario" style="display:none;">
Vario
</div>
<div id="modell_select" style="display:none;">
Select
</div>
<div id="modell_express" style="display:none;">
Express
</div>
<div>
<h1>Profil</h1>
<label for="symphonie"><img src="../image/produktbilder/tueren/profile/symphonie.gif" alt="Profil Symphonie" /></label>
<input type="radio" id="symphonie" name="profil" value="Symphonie" style="display: none;"/>
<label for="arcade"><img src="../image/produktbilder/tueren/profile/arcade.gif" alt="Arcade" /></label>
<input type="radio" id="arcade" name="profil" value="Arcade" style="display: none;"/>
</div><!-- Ennde profil -->
</div><!-- Ende Tab-1 -->
<div id="tab_2" style="display: none;">
<h1>Bauform</h1>
<div>
<label for="T"><img src="../image/produktbilder/tueren/bauform/T.gif" alt="Einpflügig" /></label>
<input type="radio" id="T" name="bauform" value="Einflügig" style="display: none;" onclick="javascript:CheckRadio('T');"/>
<label for="TSL"><img src="../image/produktbilder/tueren/bauform/TSL.gif" alt="Einpflügig-Seitenteil links" /></label>
<input type="radio" id="TSL" name="bauform" value="Einflügig Seitenteil links" style="display: none;" onclick="javascript:CheckRadio('TSL');"/>
<label for="TSR"><img src="../image/produktbilder/tueren/bauform/TSR.gif" alt="Einpflügig Seitenteil rechts" /></label>
<input type="radio" id="TSR" name="bauform" value="Einflügig Seitenteil rechts" style="display: none;" onclick="javascript:CheckRadio('TSR');"/>
<label for="T2S"><img src="../image/produktbilder/tueren/bauform/T2S.gif" alt="Einpflügig mit 2 Seitenteile" /></label>
<input type="radio" id="T2S" name="bauform" value="Einflügig mit 2 Seitenteile" style="display: none;" onclick="javascript:CheckRadio('T2S');"/>
<label for="TO"><img src="../image/produktbilder/tueren/bauform/TO.gif" alt="Einpflügig mit Oberlicht" /></label>
<input type="radio" id="TO" name="bauform" value="Einflügig mit Oberlicht" style="display: none;" onclick="javascript:CheckRadio('TO');"/>
<label for="TSOL"><img src="../image/produktbilder/tueren/bauform/TSOL.gif" alt="Einpflügig-Seitenteil links und Oberlicht" /></label>
<input type="radio" id="TSOL" name="bauform" value="Einflügig Seitenteil links und Oberlicht" style="display: none;" onclick="javascript:CheckRadio('TSOL');"/>
<label for="TSOR"><img src="../image/produktbilder/tueren/bauform/TSOR.gif" alt="Einpflügig Seitenteil rechts mit Oberlicht" /></label>
<input type="radio" id="TSOR" name="bauform" value="Einflügig Seitenteil rechts mit Oberlicht" style="display: none;" onclick="javascript:CheckRadio('TSOR');"/>
<label for="T2SO"><img src="../image/produktbilder/tueren/bauform/T2SO.gif" alt="Einpflügig mit 2 Seitenteile und Oberlicht" /></label>
<input type="radio" id="T2SO" name="bauform" value="Einflügig mit 2 Seitenteile und Oberlicht" style="display: none;" onclick="javascript:CheckRadio('T2SO');"/>
</div>
<div>
<label for="2T"><img src="../image/produktbilder/tueren/bauform/2T.gif" alt="Zweiflügig" /></label>
<input type="radio" id="2T" name="bauform" value="Zweiflügig" style="display: none;" onclick="javascript:CheckRadio('2T');"/>
<label for="2TSL"><img src="../image/produktbilder/tueren/bauform/2TSL.gif" alt="Zweiflügig-Seitenteil links" /></label>
<input type="radio" id="2TSL" name="bauform" value="Zweiflügig Seitenteil links" style="display: none;" onclick="javascript:CheckRadio('2TSL');"/>
<label for="2TSR"><img src="../image/produktbilder/tueren/bauform/2TSR.gif" alt="Zweipflügig Seitenteil rechts" /></label>
<input type="radio" id="2TSR" name="bauform" value="Zweiflügig Seitenteil rechts" style="display: none;" onclick="javascript:CheckRadio('2TSR');"/>
<label for="2T2S"><img src="../image/produktbilder/tueren/bauform/2T2S.gif" alt="Zweipflügig mit 2 Seitenteile" /></label>
<input type="radio" id="2T2S" name="bauform" value="Zweiflügig mit 2 Seitenteile" style="display: none;" onclick="javascript:CheckRadio('2T2S');"/>
<label for="2TO"><img src="../image/produktbilder/tueren/bauform/2TO.gif" alt="Einpflügig mit Oberlicht" /></label>
<input type="radio" id="2TO" name="bauform" value="Einflügig mit Oberlicht" style="display: none;" onclick="javascript:CheckRadio('2TO');"/>
<label for="2TSOL"><img src="../image/produktbilder/tueren/bauform/2TSOL.gif" alt="Zweipflügig-Seitenteil links und Oberlicht" /></label>
<input type="radio" id="2TSOL" name="bauform" value="Zweiflügig Seitenteil links und Oberlicht" style="display: none;" onclick="javascript:CheckRadio('2TSOL');"/>
<label for="2TSOR"><img src="../image/produktbilder/tueren/bauform/2TSOR.gif" alt="Zweipflügig Seitenteil rechts mit Oberlicht" /></label>
<input type="radio" id="2TSOR" name="bauform" value="Zweiflügig Seitenteil rechts mit Oberlicht" style="display: none;" onclick="javascript:CheckRadio('2TSOR');"/>
<label for="2T2SO"><img src="../image/produktbilder/tueren/bauform/2T2SO.gif" alt="Zweipflügig mit 2 Seitenteile und Oberlicht" /></label>
<input type="radio" id="2T2SO" name="bauform" value="Zweiflügig mit 2 Seitenteile und Oberlicht" style="display: none;" onclick="javascript:CheckRadio('2T2SO');"/>
</div> <!-- Ende Bauformen -->
<div>
<h1>Maße</h1>
<div id="hbe" style="display: block;">
<div>Breite: <input type="text" name="breite" id="breite" maxlength="4" onblur="checkBreite()"/>mm (900mm - 1200mm)</div><span id="FehlerBreite" style="display: none;">Die angegebene Breite wird nicht geführ</span>
<div><label id="hoehe">Höhe: </label><input type="text" name="hoehe" id="hoehe" maxlength="4" />mm (1950mm - 2240mm)</div>
</div><!-- Ende Höhe/Breite einflügig -->
<div id="hbz" style="display: none;">
<div><label id="breiteFLl">Breite linker Flügel </label><input type="text" name="breiteFLl" id="breite" maxlength="4" />mm (900mm - 1200mm)</div>
<div><label id="breiteFLr">Breite rechter Flügel </label><input type="text" name="breiteFLr" id="breite" maxlength="4" />mm (900mm - 1200mm)</div>
<div><label id="hoehez">Höhe: </label><input type="text" name="hoehez" id="hoehe" maxlength="4" />mm (1950mm - 2240mm)</div>
</div><!-- Ende Höhe/Breite zweiflügig -->
<div id="sl" style="display: none;">
<div>
<select name="variationL">
<option>verglast - beweglich</option>
<option>verglast - fest</option>
<option>geschlossen - beweglich</option>
<option>geschlossen - fest</option>
</select>
<select name="fuellungL">
<option>Einsatzfüllung</option>
<option>einseitige Aufsatzfüllung</option>
<option>zweiseitige Aufsatzfüllung</option>
</select>
</div>
<div><label id="breiteSl">Breite linker Seitenteil </label><input type="text" name="breiteSl" id="breiteSl" maxlength="4" onblur="checkSL()"/>mm (400mm - 1500mm)</div>
</div><!-- Ende Seitenteil links -->
<div id="sr" style="display: none;">
<div>
<select name="variationR">
<option>verglast - beweglich</option>
<option>verglast - fest</option>
<option>geschlossen - beweglich</option>
<option>geschlossen - fest</option>
</select>
<select name="fuellungR">
<option>Einsatzfüllung</option>
<option>einseitige Aufsatzfüllung</option>
<option>zweiseitige Aufsatzfüllung</option>
</select>
</div>
<div><label id="breiteSr">Breite linker Seitenteil </label><input type="text" name="breiteSr" id="breiteSr" maxlength="4" onblur="checkSR()"/>mm (400mm - 1500mm)</div>
</div><!-- Ende Seitenteil rechts -->
<div id="o" style="display: none;">
<div><label id="oberlicht">Höhe Oberlicht</label><input type="text" name="oberlicht" id="oberlicht" maxlength="4" onblur="checkO()"/>mm (250mm - 1200mm)</div>
</div><!-- Ende Oberlicht -->
</div><!-- Ende Maße -->
</div><!-- Ende Tab-2-->
<div id="tab_3" style="display: none;">
<h1>Farbe</h1>
<div>
<h3>Dekorfarben</h3>
</div><!-- Ende Dekorrfarben -->
<div>
<h3>Ralfarben</h3>
</div><!-- Ende Ral -->
<h1>Glas</h1>
<div>
glas
</div><!-- Ende Glas -->
</div><!-- Ende Tab-3 -->
<div id="tab_4" style="display: none;">
<h1>Griffe</h1>
<div>
<h3>Griff</h3>
</div><!-- Ende Griff -->
<div>
<h3>Innendrücker</h3>
</div><!-- Ende Innendrücker -->
<div>
<h3>Extras</h3>
</div><!-- Ende Extras -->
</div><!-- Ende Tab-4 -->
<input type="submit" name="submit"/>
</div><!-- Ende Konfigurator -->
<div class="clear"></div>
</div><!-- Ende Body -->
</div><!-- Ende Main -->
</form>
</body>
</html>
Wenn ich es über meinen Editor (Webcon Scriptly) mit dem IE jage, kommt die Fehlermeldung, das checkBreite nicht definiert oder Null ergibt aus. Aber es kommt auch eine Fehlermeldung wegen den style :|
Es funktioniert aber auch keine alert-Box
Gruß, Kalito