Hallo,
ich führe psychologische Onlinestudien durch bei denen die Teilnehmer auf Fragen antworten indem sie Radiobuttons betätigen. Beim betätigen der Radiobuttons geschieht dann (1) Speicherung der Reaktionszeit, (2) Speicherung des Wertes des ausgewählten Buttons und (3) automatische Weiterleitung zur nächsten Seite (mit der nächsten Frage).
Mein Problem: Ich will jetzt von Mausklicks auf Tastatureingabe umsteigen und kenne mich bei JavaScript überhaupt nicht aus. Ich vermute mal, dass man nur 1-2 Zeilen im Quelltext umschreiben muss aber ich blick leider überhaupt nicht durch...
Hier ist der Quelltext einer typischen Seite des Onlinefragebogens:
<?php
include ('fieldforwarder.php');
?>
<html>
<script language="Javascript">
<!--
//ASSUMPTIONS MADE:
// - This JavaScript code assumes that the hosting form is called "myForm".
// - If you use timeOuts and see a timer, call the watching object "myTimerViewer" and ensure
// that you have a submit-input field.
//
// Of course you can search and replace within the code in order to change these naming conventions...
// Change the following constants as needed
var arrayLength=1; // the arrayLength has to be the number of items you use on the current website! - 1. thing you have to adapt on your study concerning the time meassurement.
var timeOutLimit=-1; // Define your timeOut in milliseconds here or -1 if you don't want timeouts
var timeOutRefresh=100; // Define a refresh time here. Try not to choose smaller values unless it's absolutly necessary.
var showTime=false; // Display time? (true - false)
var showRemainingTime=false; // Display the past or the remaining time? (true - false)
var showMillis=false; // Display time in milliseconds? (If not time will be displayed in minutes) (true - false)
//Don't change these members
var timeOutStart
var lastClickTime;
var antwortZeiten=new Array(arrayLength);
var timeOutTriggered=false;
function initialisiere() {
var lauf;
lastClickTime=new Date();
//AntwortZeiten mit 0 initialisieren
for (lauf=0;lauf<arrayLength;lauf++) {
antwortZeiten[lauf]=0;
}
//timeout enabled?
if (timeOutLimit>=0) {
if (timeOutRefresh<10) timeOutRefresh=10;
timeOutStart=new Date();
handleTimerEvent();
}
}
function getTimeDifference(d1,d2) {
var iStr=Date.parse(d1.toUTCString());
var jStr=Date.parse(d2.toUTCString());
iStr=iStr+d1.getMilliseconds();
jStr=jStr+d2.getMilliseconds();
var difference=jStr-iStr;
return difference;
}
function getArrayIndexFromName(bezeichnung) {
switch (bezeichnung) {
case "actual_se_01":
return 0;
break;
default:
DEBUG("@getArrayIndexFromName: Index konnte nicht bestimmt werden!");
}
}
function handleClickEvent(senderName) {
now=new Date();
var index=getArrayIndexFromName(senderName);
antwortZeiten[index]=antwortZeiten[index]+getTimeDifference(lastClickTime,now);
lastClickTime=now;
sendResults();
myForm.submit()
}
function sendResults() {
myForm.rtactual02.value=antwortZeiten[0]
}
function handleTimerEvent() {
now=new Date();
var timeSinceStart=getTimeDifference(timeOutStart,now);
var timeToShow;
//update watcher
if (showTime==true) {
if (showRemainingTime==true) {
timeToShow=timeOutLimit-timeSinceStart;
}
else {
timeToShow=timeSinceStart;
}
if (showMillis==true) {
myForm.myTimerViewer.value=Math.floor(timeToShow/1000)+"."+Math.floor(timeToShow%1000)
}
else {
myForm.myTimerViewer.value=Math.floor(timeToShow/60000+1)
}
}
//check for timeout
if (timeSinceStart>=timeOutLimit && !timeOutTriggered) {
//TIMEOUT!
timeOutTriggered=true;
sendResults();
myForm.submit()
}
//setup timer callback
setTimeout("handleTimerEvent()",timeOutRefresh)
}
//-->
</script>
<head>
<title>Online Study - The School of Psychology at Cardiff University, Cardiff Wales</title>
<meta NAME="keywords" content="web-experiment, web-experiments, web-study, web-studies, online-study, online-studies, online-experiment, online-experiments, psychology, psychological, study, studies, experiment, experiments, online, psychological web-experiment, psychological web-experiments, psychological web-study, psychological web-studies, psychological online-study, psychological online-studies, psychological online-experiment, psychological online-experiments, psychological study, psychological studies, psychological experiment, psychological experiments, Cardiff, Cardiff University, University, Universities">
<meta NAME="description" content="Online Study - The School of Psychology at Cardiff University, Cardiff Wales">
<meta NAME="Content-Language" content="en">
<meta NAME="author" content="Jochen Gebauer">
<meta HTTP-EQUIV="Reply-to" content="soci@lpsychology.com">
<meta HTTP-EQUIV="Content-Type" CONTENT="text/html;CHARSET=iso-8859-1">
<meta name="robots" content="noindex">
<link rel="SHORTCUT ICON" href="http://www.psy.de/favicon.ico">
<link rel=stylesheet type="text/css" href="stylesheet.css">
</head>
<body bgcolor="#FFFFFF" onLoad="initialisiere()">
<form name="myForm" action="ioav16v08.php" method="post">
<?php echo field_forwarder(); ?>
<table width="700" align="center" border="0" cellspacing="0" cellpadding="0">
<tr><td>
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td><img src="pictures/banner.jpg" border="0"></td>
</tr>
<tr>
<td height="2" bgcolor="#FFFFFF"><b></b></td>
</tr>
</table>
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td height="20" width="190" bgcolor="#000000"><b></b></td>
<td width="710" bgcolor="#000000"><b class="Pt12YellowBold"><?php echo $studyname;?></b class="Pt12YellowBold"></td>
</tr>
</table>
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="190" bgcolor="#000066"><b></b></td>
<td width="630" bgcolor="#FFFFFF"><b></b></td>
<td><img src="pictures/curve_top.gif" border="0"></td>
<td width="39" bgcolor="#666699"><b></b></td>
</tr>
</table>
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td height="1" width="170" bgcolor="#000066"><b></b></td>
<td width="720" bgcolor="#000000"><b></b></td>
<td width="15" bgcolor="#666699"><b></b></td>
</tr>
</table>
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td height="10" width="170" bgcolor="#000066"><b></b></td>
<td width="1" bgcolor="#000000"><b></b></td>
<td width="10" bgcolor="#FFFFFF"><b></b></td>
<td width="700" bgcolor="#FFFFFF"><b></b></td>
<td width="10" bgcolor="#FFFFFF"><b></b></td>
<td width="1" bgcolor="#000000"><b></b></td>
<td width="15" bgcolor="#666699"><b></b></td>
</tr>
</table>
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="170" bgcolor="#000066"><b></b></td>
<td width="1" bgcolor="#000000"><b></b></td>
<td width="10" bgcolor="#FFFFFF"><b></b></td>
<td width="700" bgcolor="#FFFFFF">
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td height="10"><b></b></td>
</tr>
<tr>
<td width="10"><b></b></td>
<td><b class="Pt12Bold">To what extent do you <b class="Pt12BoldUline">ACTUALLY</b class="Pt12BoldUline"> possess this value?</b class="Pt12Bold"></td>
</tr>
<tr>
<td height="10"><b></b></td>
</tr>
</table>
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="45"><b></b></td>
<td valign="top" width="40"><br><br><b class="Pt12Fett">02c.</b class="Pt12Fett"><br><br></td>
<td valign="top"><br><br><b class="Pt12Fett">WEALTH (material possessions, money)</b class="Pt12Fett"><br><br></td>
</tr>
</table>
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td colspan="9" height="20"><b></b></td>
</tr>
<tr>
<td width="90" height="40"><b></b></td>
<td valign="center" align="middle" width="110"><b></b></td>
<td valign="center" align="middle" width="70"><b class="Pt10">0</b class="Pt10"></td>
<td valign="center" align="middle" width="70"><b class="Pt10">1</b class="Pt10"></td>
<td valign="center" align="middle" width="70"><b class="Pt10">2</b class="Pt10"></td>
<td valign="center" align="middle" width="70"><b class="Pt10">3</b class="Pt10"></td>
<td valign="center" align="middle" width="110"><b></b></td>
</tr>
<tr>
<td><b></b></td>
<td valign="center" align="middle"><b class="Pt08">SLIGHTLY</b class="Pt08"></td>
<td valign="center" align="middle"><input type="radio" name="actual_se_01" value="1" onclick="handleClickEvent(this.name);"></td>
<td valign="center" align="middle"><input type="radio" name="actual_se_01" value="2" onclick="handleClickEvent(this.name);"></td>
<td valign="center" align="middle"><input type="radio" name="actual_se_01" value="3" onclick="handleClickEvent(this.name);"></td>
<td valign="center" align="middle"><input type="radio" name="actual_se_01" value="4" onclick="handleClickEvent(this.name);"></td>
<td valign="center" align="middle"><b class="Pt08">EXTREMELY</b class="Pt08"></td>
</tr>
<tr>
<td colspan="9" height="60"><b></b></td>
</tr>
</table>
<input type="hidden" name="rtactual02" value=0>
</td>
<td width="10" bgcolor="#FFFFFF"><b></b></td>
<td width="1" bgcolor="#000000"><b></b></td>
<td width="15" bgcolor="#666699"><b></b></td>
</tr>
</table>
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td height="10" width="170" bgcolor="#000066"><b></b></td>
<td width="1" bgcolor="#000000"><b></b></td>
<td width="10" bgcolor="#FFFFFF"><b></b></td>
<td width="700" bgcolor="#FFFFFF"><b></b></td>
<td width="10" bgcolor="#FFFFFF"><b></b></td>
<td width="1" bgcolor="#000000"><b></b></td>
<td width="15" bgcolor="#666699"><b></b></td>
</tr>
</table>
<table width="900" border="0" cellspacing="0" cellpadding="0">
<tr>
<td height="1" width="170" bgcolor="#000066"><b></b></td>
<td width="720" bgcolor="#000000"><b></b></td>
<td width="15" bgcolor="#666699"><b></b></td>
</tr>
</table>
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td height="5" width="168" bgcolor="#000066"><b></b></td>
<td width="22" bgcolor="#000033"><b></b></td>
<td width="671" bgcolor="#CCCCFF"><b></b></td>
<td width="24" bgcolor="#333366"><b></b></td>
<td width="15" bgcolor="#666699"><b></b></td>
</tr>
</table>
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="190" bgcolor="#000066"><b></b></td>
<td width="630" bgcolor="#FFFFFF"><b></b></td>
<td><img src="pictures/curve_bottom.gif" border="0"></td>
<td width="39" bgcolor="#666699"><b></b></td>
</tr>
</table>
<table width="900" align="center" valign="middle" border="0" cellspacing="0" cellpadding="0">
<tr align="center" valign="middle">
<td height="50"><b class="Pt10">Email questions to <b class="Pt10UlineBlue"><a href="mailto:Soci@lPsychology.com">Soci@lPsychology.com</a></b class="Pt10UlineBlue"><br>Copyright (c) 2004-2005 by Jochen E. Gebauer</b class="Pt10"></td>
</tr>
</table>
</td></tr>
</table>
</form>
</body>
</html>