Using the enter key to submit an answer in a textbox instead of using a mouseclick? HELP

Question

Hello fello twiners,

 

I made a secret agent textbased puzzle game in which you'll need to put the correct answer in a textbox. When the given answer is correct you can proceed to the next page. This works perfectly but only when you press the button with a mouseclick.

Is there a way to use an enterkey hit/stroke instead of using the mouse after you're finished with typing it in.

Thanks a lot!

If you're interested in the game you can find it at SENTINEL PROGRAM

This is my current code:

<<set $answer to ''>>\

<<textbox '$answer' '' autofocus>>

<span id='textbox-reply'></span>



<span id='textbox-submit'>\

    <<button 'Send Intel'>>

        <<set $answer to $answer.trim().toLowerCase().replace(/\s\s+/g, ' ')>>

        <<if $answer is “oceanus”>>

            <<replace '#textbox-reply'>>\



                Correct!\

<</replace>>

            <<replace '#textbox-submit'>>\

    [[Mission 1: The Cipher Succeeded]]\

            <</replace>>

            <<run $('#textbox-answer').attr('readonly', 'true');>>

        <<else>>

            <<replace '#textbox-reply'>>\

                Incorrect.  Please try again.\

            <</replace>>

        <</if>>

    <</button>>\

</span>

 

 

 

Answer 1

First, you'll need to change:

<<if $answer is “oceanus”>>

to:

<<if $answer is "oceanus">>

because the "fancy" quotes you have currently won't work.  You need to use standard quote markers instead.  (If you're copying the code from a Word document or something, that's a problem you'll need to watch out for.)

Anyways, for what you want, this bit of code will find the textbox, and then add an event to it which watches for the "ENTER" key (key code 13), and then triggers the click on the button when the "ENTER" key is hit:

<<script>>
$(document).one(":passagerender", function (ev) {
	$(ev.content).find("#textbox-answer").on("keyup", function (e) {
		if (e.keyCode === 13) {
			$("#textbox-submit button").trigger("click");
		}
	});
});
<</script>>

Just add that code to that same passage and that should do the trick.

For details, see the :passagerender event, and for the "$(...)" stuff see the jQuery documentation.

Hope that helps!  :-)