jsPsych/examples/jspsych-html.html
Josh de Leeuw 94895eae24 bug fix
2013-11-11 23:41:17 -05:00

55 lines
1.9 KiB
HTML

<!doctype html>
<html>
<head>
<title>jspsych-html plugin example</title>
<!-- jQuery -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" ></script>
<!-- jsPsych -->
<script src="scripts/jspsych.js"></script>
<script src="scripts/plugins/jspsych-html.js"></script>
<!-- style -->
<style>
#jspsych_target { margin: 50px auto 50px auto; width: 600px; font-size:18px; text-align: center;}
pre { text-align: left; }
</style>
</head>
<body>
<div id="jspsych_target">
</div>
</body>
<script type="text/javascript">
// the html function loads external html content into the page.
// the external content is a file called "external_page.html"
// in the same directory as this file.
// sample function that might be used to check if a subject has given
// consent to participate.
var check_consent = function(elem) {
if ($('#consent_checkbox').is(':checked')) {
return true;
}
else {
alert("If you wish to participate, you must check the box next to the statement 'I agree to participate in this study.'");
return false;
}
return false;
};
// declare the block.
var html_block = {type:'html', pages: [{url: "external_page.html", cont_btn: "start", check_fn: check_consent}]};
jsPsych.init({
display_element: $('#jspsych_target'),
experiment_structure: [html_block],
on_finish:function(data){
$('#jspsych_target').append($("<pre>",{
html: JSON.stringify(data,undefined,2)
}));
}
});
</script>
</html>