usbwebserver javascript en buttons werken niet

Status
Niet open voor verdere reacties.

Molovhic

Gebruiker
Lid geworden
27 mei 2016
Berichten
76
Dag allemaal

Ik ben een projectje aan het testen op mijn usbwebserver.
Alles verloopt goed tot het moment dat ik eigenlijk aanklikbare png's wilden maken.

Ik merk dat javascript onderdelen niet werken, alsook een gewone "button" kan ik gewoonweg niet aanklikken.
Heb totaal geen idee waar het probleem zich bevindt..

Hopelijk kan iemand helpen aan de hand van de code..


Dit is mijn index pagina
HTML:
<?php
include("inc/inc_pagina.php");

	if(!isset($_GET['pagina'])){

		$_GET['pagina'] = "home";
	}
?>
<!DOCTYPE html>
<html>
	<head>
		<title> Test </title>
		<meta charset="utf-8">
		<meta name="description" content="Test website">
		<link rel="stylesheet" type="text/css" href="css/style.css">
	</head>
<body>
	<header>
		<img src="images/logo.png" alt="logo" id="headerlogo">
		<h1>webpage </h1>
	<nav>
		<ul id="main-menu">
			<li><a href="index.php?pagina=home" target="_self">Home</a></li>
			<li><a href="#">Planning</a></li>
			<li><a href="index.php?pagina=pagina2" target="_self">pagina2</a></li>
			<li><a href="#">pagina3</a></li>
			<li><a href="#">pagina4</a></li>
			<li><a href="#">pagina5</a></li>
			<li><a href="#">pagina6</a></li>
			<li><a href="index.php?pagina=test">Testpagina</a></li>
			<!-- <li><a href="http://validator.w3.org/">w3c validator</a></li> -->
		</ul>
	</nav>
	</header>
	<section>
		<?php include(pagina($_GET['pagina'])); ?>
		<input type="button" value="Click me" onclick="msg(werkt niet)"/>
	</section>
	<footer>Copyright 2019
	</footer>
</body>
</html>

Dit is mijn testpagina waar eigenlijk niets werkt op dit moment..
HTML:
<html>
	<head>
		<title> Test </title>
		<meta charset="utf-8">
		<meta name="description" content="Test website">
		<link rel="stylesheet" type="text/css" href="css/style.css">
	</head>
<body>
	<script type="text/javascript">
		function changeimg(){
		var minus = document.getElementsByClassName("minus")[0];
		if (minus.src == "images/alert.png") {
			minus.src = "images/alert2.png";
		}
		else{
			minus.src = "images/alert.png";
		}
	</script>
		<img src="images/alert2.png" onclick="changeimg(this)" alt="alert" id="Alert" class="minus" width="25px" height="25px"/>
	<script type="text/javascript">
		var image_tracker = 'checked2';
		function change(){
		var image = document.getElementById('checked');
		if(image_tracker=='checked2'){
		image.src='images/checked.png';
		image_tracker='checked';
		}
		else{
		image.src='checked2.png';
		image_tracker='checked';
		}
		}
	</script>
		<img src="images/checked2.png" alt="checked" id="checked" onclick="change();" width="25px" height="25px"/>
	<script>
		function changeImg2() {
		var image = document.getElementById('myImg');
		if (image.src.match("images/alert2.png")) {
			image.src = "images/alert.png";
		}
		else {
			image.src = "images/alert2.png";
		}
		}
	</script>
		<img src="images/alert2.png" id="myImg" width="25px" height="25px">
		<input type="button" onclick="changeImg2()" value="Change" />
</body>
</html>
 
Hier werkt het wel in de JS Fiddle sandbox.
Bekijk je het niet via file:// o.i.d?
 
Kijk eens in je JavaScript Debugger van je browser.
 
Waarschijnlijk heb je het al gevonden, je mist een } boven </script>
Code:
<script type="text/javascript">
function changeimg() {
    var minus = document.getElementsByClassName("minus")[0];
    if (minus.src == "images/alert.png") {
        minus.src = "images/alert2.png";
    } else {
        minus.src = "images/alert.png";
    }
</script>
 
Laatst bewerkt:
Hoi, was even dit topic vergeten af te sluiten.
Idd gevonden ondertussen

Het probleem was dat het section gedeelte in css in position:relative; stond..
Eens verwijdert was het probleem opgelost

Gr
 
Status
Niet open voor verdere reacties.
Steun Ons

Nieuwste berichten

Terug
Bovenaan Onderaan