2019-02-24 15:51:40 -07:00
|
|
|
|
Summary: Using JavaScript Input Helpers
|
|
|
|
|
Author: neale
|
|
|
|
|
Script: helpers.js
|
|
|
|
|
Answer: helper
|
|
|
|
|
|
|
|
|
|
MOTH only takes static answers:
|
|
|
|
|
you can't, for instance, write code to check answer correctness.
|
|
|
|
|
But you can provide as many correct answers as you like in a single puzzle.
|
|
|
|
|
|
|
|
|
|
This page has an associated `helpers.js` script
|
|
|
|
|
you can include to assist with input formatting,
|
|
|
|
|
so people aren't confused about how to enter an answer.
|
|
|
|
|
|
2019-02-24 17:02:28 -07:00
|
|
|
|
You could also write your own JavaScript to validate things.
|
2019-02-24 15:51:40 -07:00
|
|
|
|
|
|
|
|
|
This is just a demonstration page.
|
|
|
|
|
You will probably only want one of these in a page,
|
|
|
|
|
to avoid confusing people.
|
|
|
|
|
|
|
|
|
|
Timestamp
|
|
|
|
|
<input type="datetime-local" class="answer">
|
|
|
|
|
|
|
|
|
|
All lower-case letters
|
|
|
|
|
<input class="answer lower">
|
|
|
|
|
|
|
|
|
|
Multiple concatenated values
|
|
|
|
|
<div class="answer lower">
|
|
|
|
|
<input type="color">
|
|
|
|
|
<input type="number">
|
|
|
|
|
<input type="range" min="0" max="127">
|
|
|
|
|
<input>
|
|
|
|
|
</div>
|
|
|
|
|
|
2019-04-10 13:56:17 -06:00
|
|
|
|
Free input, sorted, concatenated values
|
|
|
|
|
<ul class="answer lower sort">
|
|
|
|
|
<li><input></li>
|
2019-04-10 14:04:04 -06:00
|
|
|
|
<li><button class="expand" title="Add another input">➕</button><l/i>
|
2019-04-10 13:56:17 -06:00
|
|
|
|
</ul>
|
|
|
|
|
|
2019-02-24 15:51:40 -07:00
|
|
|
|
Select from an ordered list of options
|
|
|
|
|
<ul class="answer">
|
|
|
|
|
<li><input type="checkbox" value="horn">Horns</li>
|
|
|
|
|
<li><input type="checkbox" value="hoof">Hooves</li>
|
|
|
|
|
<li><input type="checkbox" value="antler">Antlers</li>
|
|
|
|
|
</ul>
|