Изменить, чтобы лучше объяснить, что мой вопрос:HTML5 - Ajax - неожиданное поведение я не понимаю
- У меня есть Div с Page 1 в качестве содержания.
- Page 1 есть кнопка, которая изменяет содержимое моего DIV на страницу 2.
- Page 2 имеет кнопку, которая изменяет содержание моих дел до страницы 1.
Выпуск: Если Страница 1 загружается первой, кнопка ничего не делает. Если страница загружена первой, кнопка изменяет содержимое на страницу 1. И кнопка на странице 1 затем РАБОТАЕТ (если страница 1 не загружена до страницы 2! Это моя проблема!).
Ive пытался разработать учебный инструмент для математики. На самом деле, я не сработал правильно в самом начале, потому что я просто не вижу причины для следующего поведения.
Вопрос: Почему это работает, только если я загружаю страницы в неправильном порядке?
Страница: MathTrainer Код страницы внизу публикации.
Что я пытаюсь:
У меня есть selectionpage загруженного в DIV, это Див населена PHP-Include. При нажатии кнопки я хочу, чтобы содержимое div менялось на инструмент тренировки. Итак, «вопрос» - «option1» - «option2» ... ect. Наряду с кнопкой, чтобы вернуться к выбору с помощью того же метода.
Это изменение обрабатывается через «onclick» из кнопки отправки и вызывает функцию в JS. А именно:
$("#trainercontent").load('trainerAbfrage.php');
Что происходит:
Ничего, .. как на самом деле ничего, кроме pagereload благодаря представить функции я думаю. Div-контент не меняется.
Что делает это неожиданное поведение?
Помимо того, что я не работал, я сначала попытался включить учебный трюк и воспользовался кнопкой, чтобы вернуться к выбору (это должно быть действительно показано первым). И это работает. Также он работал, когда у меня была кодировка страницы как «ISO» и перестала работать, когда я переключился на UTF-8. Кодирование не должно испортить мою страницу, как это, не так ли?
Что делает это еще более неожиданным?
Если я включил первую страницу тренера, используйте кнопку «Назад», чтобы перейти на страницу выбора, а затем нажмите кнопку «Пуск», она ТАКЖЕ работает! Это действительно запутало меня, поскольку это тот же самый код, тот же самый файл загружен! Почему это работает, если это не первая страница?
Что я пытался отладить:
- Я удалил PHP-Include и заменил его на javafunction страницы загружаются, чтобы проверить, если PHP участвует в моей проблеме. Такое же поведение. Если выбор показан первым, я не могу переключиться на тренера, но Я могу переключиться назад, если сначала показан тренер.
- Переключилось обратно в кодировку ISO, не повезло.
- Затем я попытался изменить свою структуру файла (я знаю, но исчерпал идеи действительно), поэтому каждый файл находится в той же папке на моем сервере. Такое же поведение.
Код, Главная:
<!doctype html>
<html lang="de">
<head>
<!-- Titel der Webseite -->
<title>Mathematik - Definitions-Trainer</title>
<!-- Metadaten der Webseite -->
<meta charset="UTF-8">
<meta name="author" content="Heumann Marco">
<meta name="keywords" content="Mathe, Mathematik, Lehramt, Gymnasium, Trainer, Übungen, lernen, Axiom, Axiome, Definition, Definitionen">
<meta name="description" content="Definitions und Axioms-Trainer für das Lehramt der Mathematik an Gymnasien.">
<!-- Verweis auf die JavaScripte die benutzt werden sollen -->
<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.min.js"></script><!-- weil jQuery sexy ist-->
<script type="text/javascript" src="https://c328740.ssl.cf1.rackcdn.com/mathjax/latest/MathJax.js?config=TeX-MML-AM_HTMLorMML"></script><!-- Matheformeln aufhübschen hiermit -->
<script type="text/javascript" src="../javascript/ios.js"></script><!-- damits mit Touchscreens auch gut geht -->
<!-- Eigene Javascripte -->
<script type="text/javascript" src="javaTrainer.js"></script>
<!-- Verweis auf die Styledateien die benutzt werden soll -->
<link rel="stylesheet" type="text/css" href="styleTrainer.css">
</head>
<body>
<div id="trainerheader">
<h1>Definitions und Axioms - Trainer</h1>
</div>
<div id="trainercontent">
<?php
//dynamischer php-Aufbau des Contents
include 'trainerAuswahl.php';
?>
</div>
<div id="footer">
<!-- php include des Footers-->
<?php include '../includes/footer.php'; ?>
</div>
</body>
код, Selectionpage:
<h2>Wähle Deine Abfrageoptionen</h2>
<form>
<fieldset>
<legend>Bereich einschränken</legend>
<p>
<label>Semester/Kurs</label>
<select id = "listSemester" name="selectSemester">
<option value = "0">Alle</option>
<option value = "1">1. Semester - Analysis einer Variablen</option>
<option value = "2">2. Semester - Lineare Algebra</option>
</select>
</p>
<p>
<label>Kapitel/Thema</label>
<select id = "listKapitel" name="selectKapitel">
<option value = "1">Alle</option>
</select>
</p>
</fieldset>
<fieldset>
<legend>Art der Abfrage</legend>
<p>Unabhängig von der gewählten Option werden alle Relevanten Infos in der Auflösung angezeigt. Je nach Frage kann es auch weitere Hinweise und Erklärungen geben.</p>
<br/>
<input type = "radio" name = "skill" id = "geringID" value = "gering" checked = "checked" />
<label for = "geringID"><font color="green">Leicht</font> für Einsteiger, viel Text.</label><br/>
<input type = "radio" name = "skill" id = "gutID" value = "gut" />
<label for = "gutID"><font color="orange">Medium</font> für Prüfungsvorbereitung, viele Formeln.</label><br/>
<input type = "radio" name = "skill" id = "perfektID" value = "perfekt" />
<label for = "perfektID"><font color="red">Schwer</font> für Freaks, nur Formeln, Zahlen und Griechen!</label><br/>
<input type = "radio" name = "skill" id = "testID" value = "test" />
<label for = "perfektID"><font color="blue">Debug</font> für Testzwecke</label><br/>
</fieldset>
<p>
<input type="submit" onclick="abfrage();" value="Starte die Abfrage"/>
</p>
код, Trainerpage:
<h2>Hier werden sie getestet!</h2>
<h3>Frage...</h3>
<p>Option 1</p>
<p>Option 2</p>
<p>Option 3</p>
<p>Option 4</p>
<p>Option 5</p>
<p><input type="submit" onclick="auswahl();" value="Back zur Auswahl"/></p>
код, Javascript:
//wenn jemand auf den Button klickt um die Abfrage zu starten
function abfrage()
{
$("#trainercontent").load('trainerAbfrage.php');
}
//wenn jemand auf den Button klickt um zur Auswahl zurück zu kommen
function auswahl()
{
$("#trainercontent").load("trainerAuswahl.php");
}
Звучит неплохо, но ничего не меняет на странице. Он по-прежнему перезагружается при нажатии. И он по-прежнему не изменяет div на тренировочную страницу. Изменить: перезагрузка не моя проблема. (прямо сейчас) ... я просто хочу изменить содержимое своего div и понять, почему порядок, в который вставлены страницы, изменяет функциональность от «рабочей» до простой «не работает». :-) – Rattenmann
Это ничего не делает, если у вас нет этого: 'onclick =" return abfrage(); "' также. И даже в этом случае проще просто «onclick =» abfrage(), вернуть false; «и не иметь дело с возвратом чего-либо в функции – Ian
Хорошо, полностью забыл об этом, моя вина. Он работает, как вы предложили. Но можете ли вы объяснить, почему она уже работала, если первая страница загружена первой? В конце концов, если я переключаюсь со страницы 2 на страницу 1 ... страница 1 точно такая же, как если бы она была загружена сначала в первую очередь. Это сводит меня с ума :( – Rattenmann