I have a form that only shows one question/input at a time and it uses the enter key (if pressed inside the input) to move from one question to another.
I need a way to prevent the enter key action if there are less or equal to 2 characters in the input...as a way of making sure that people actually write something in there and don't just go over them.
Here is the part of my script that involves the enter key:
triggers.first().addClass('active');
form.hide().first().show();
function sliderResponse(target) {
form.fadeOut(500).delay(500).eq(target).fadeIn(700);
triggers.removeClass('active').eq(target).addClass('active');
}
triggers.click(function() {
if ( !$(this).hasClass('active') ) {
target = $(this).index();
sliderResponse(target);
}
});
$('input').bind('keypress', function(e) {
if(e.keyCode==13){
target = $('#command ul.triggers li.active').index();
target === lastElem ? target = 0 : target = target+1;
sliderResponse(target);
}
});
And the standard input html :
<h1>Do you have a current website?</h1>
<input type="text" value="If you do, please insert the link…" id="last" name="last" class="fields" onFocus="if(this.value == 'If you do, please insert the link…') {this.value = '';}" onBlur="if (this.value == '') {this.value = 'If you do, please insert the link…';}" />
UPDATE
This is a way to disable the enter key: But how can I make the condition of the two characters?
$("input").keypress(function (evt) {
var charCode = evt.charCode || evt.keyCode;
if (charCode == 13) {
return false;
}
});
You can check the length of the value to see how many characters are inputted
$("input").on('keydown', function(evt) {
if (evt.which === 13 && this.value.length < 3) {
return false;
}
});