We Keep Coding

click to return false, click again to return true

When someone clicks a button I want my function to return false and the keydown function will be disabled.
Then, if I click this same button a second time, it will return true and the keydown function will be enabled.
I did like this but it only returns false and keydown function disabled. I also need to enable this keydown function by clicking this button.
How can I do this?
var controlsEnabled = true;
$(".keyboard-btn").on('click', function() {
controlsEnabled = false;
});
$(document).keydown(function(e) {
if (controlsEnabled) {
if (e.keyCode == 38) {
verticalSlideDown();
console.log("pressed key for Down : " + e.keyCode);
}
if (e.keyCode == 40) {
verticalSlideUp();
console.log("pressed key for Up: " + e.keyCode);
}
if (e.keyCode === 13) {
var div = $(".scroll-inner-container");
console.log("pressed key for stop : " + e.keyCode);
div.stop();
}
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button class="keyboard-btn">click here</button>

Your click even only ever sets controlEnabled to false. You need a way to toggle.
The quickest option is to write this
$(".keyboard-btn").on('click', function() {
controlsEnabled = !controlsEnabled // will toggle false -> true or true -> false;
});
You could also use if statements to achieve the same thing.. like this
$(".keyboard-btn").on('click', function()
{
if(controlsEnabled)
{
controlsEnabled = false;
}
else
{
controlsEnabled = true;
}
});
This is more long-winded, but perfectly valid, and you could argue it's easier to read. You could also use a ternary operator like this
controlsEnabled = (controlsEnabled)? false : true;
But that wouldn't really give any advantage, being neither easier to read, or more elegant. But it's worth knowing the different ways to conditionally set a value based on itself. You never know when it might come in handy.

How about this?
$(".keyboard-btn").on('click', function() {
controlsEnabled = !controlsEnabled;
});

This may helpful
$(".keyboard-btn").on('click', function () {
controlsEnabled= controlsEnabled? false :true ; // controlsEnabled = !controlsEnabled
});

Just replace first 4 lines with this code :
var controlsEnabled = true;
$(".keyboard-btn").on('click', function() {
controlsEnabled = !controlsEnabled;
});

Firstly, your function doesn't return anything at the moment - you need to add the return keyword.
Secondly, your code isn't performing a boolean switch, it is merely assigning a boolean value. As true=1 and false=0, you can write:
controlsEnabled^=1;
which uses the XOR operator to switch from true to false and back again.

Detecting a shift + click with Jquery on Chrome

I'm trying to detect a shift click with javascript but for some reason it only works on IE
.click(function (e) {
if (e.shiftKey) {
Rain();
}
});
this is the code that work for me in IE, how can I detect it on Chrome

I don't think there is a defined combo, but you could make it yourself. A (crude) example:
<div id="someElement">
Click me for an alert!
</div>
<script>
var shiftPressed = false;
$(document).keydown(function(event) {
shiftPressed = event.keyCode==16;
});
$(document).keyup(function(event) {
if( event.keyCode==16 ){ shiftPressed = false; }
});
$('#someElement').on('click', function(e){
if( shiftPressed ){
alert("Shift and click!");
}
else{ alert("Nope"); }
});
</script>
You could improve it by only binding the .keyup() when the keydown is a shift in order to minimize the number of events. You should add as little logic as possible outside the if statements, as this event gets fired a lot

jQuery on click toggle event

I've made a function which selects an item when you click on it. And made it so when I've selected more than 10, it stops adding to selectedItems.
But when 10 items is selected, I can still toggle the class d-items-selected by clicking. How do I disable that? I've tried to use stop() but that canceled the hole thing, so I couldn't 'de-select' the items again.
$(document).ready(function(){
$('.d-items').on('click', function(e){
e.preventDefault();
$(this).toggleClass('d-items-selected');
var selectedItems = $('.d-items-selected').length;
if(selectedItems > 10) {
$('.d-items').finish();
} else {
$('#ItemsSelected').html(selectedItems);
}
});
});

You can disable controls which are not selected. Something like this.
$(document).ready(function(){
$('.d-items').on('click', function(e){
e.preventDefault();
$(this).toggleClass('d-items-selected');
var selectedItems = $('.d-items-selected').length;
if(selectedItems > 10) {
//do not allow to select
$(this).removeClass('d-items-selected');
} else {
$('#ItemsSelected').html(selectedItems);
}
});
});

Would unbinding the click event work for you?
e.g.
if(selectedItems > 10) {
$('.d-items').unbind("click");
}
Otherwise you can rebind it to a different function after selectedItems > 10, or anything really.
edit: It would help if you clarified what exactly you want to happen on click after selectedItems > 10

Maybe try
e.stopPropagation() or
e.stopImmediatePropagation()

I tried to figured out a solution:
$(function () {
$('.d-items').on('click', function(e) {
e.preventDefault();
var selectedItems = $('.d-items-selected').length;
//if selected items are less then 10
// or the current item is already selected you can deselect
if (selectedItems<10 || (selectedItems>=10 && $(this).is('.d-items-selected'))) {
$(this).toggleClass('d-items-selected');
}
if (selectedItems > 10) {
$('.d-items').finish();
} else {
$('#ItemsSelected').html(selectedItems);
}
});
});

$(document).ready(function(){
var i=0;
$('.d-items').on('click', function(e){
e.preventDefault();
if($(this).hasClass('d-items-selected')) {
$(this).removeClass('d-items-selected');
i--;
console.log("deleted"+i);
}
else {
if(i<10) {
$(this).addClass('d-items-selected');
i++;
console.log("added"+i);
}
}
})
});

Catch only keypresses that change input?

I want to do something when a keypress changes the input of a textbox. I figure the keypress event would be best for this, but how do I know if it caused a change? I need to filter out things like pressing the arrow keys, or modifiers... I don't think hardcoding all the values is the best approach.
So how should I do it?

In most browsers, you can use the HTML5 input event for text-type <input> elements:
$("#testbox").on("input", function() {
alert("Value changed!");
});
This doesn't work in IE < 9, but there is a workaround: the propertychange event.
$("#testbox").on("propertychange", function(e) {
if (e.originalEvent.propertyName == "value") {
alert("Value changed!");
}
});
IE 9 supports both, so in that browser it's better to prefer the standards-based input event. This conveniently fires first, so we can remove the handler for propertychange the first time input fires.
Putting it all together (jsFiddle):
var propertyChangeUnbound = false;
$("#testbox").on("propertychange", function(e) {
if (e.originalEvent.propertyName == "value") {
alert("Value changed!");
}
});
$("#testbox").on("input", function() {
if (!propertyChangeUnbound) {
$("#testbox").unbind("propertychange");
propertyChangeUnbound = true;
}
alert("Value changed!");
});

.change() is what you're after
$("#testbox").keyup(function() {
$(this).blur();
$(this).focus();
$(this).val($(this).val()); // fix for IE putting cursor at beginning of input on focus
}).change(function() {
alert("change fired");
});

This is how I would do it: http://jsfiddle.net/JesseAldridge/Pggpt/1/
$('#input1').keyup(function(){
if($('#input1').val() != $('#input1').attr('prev_val'))
$('#input2').val('change')
else
$('#input2').val('no change')
$('#input1').attr('prev_val', $('#input1').val())
})

I came up with this for autosaving a textarea. It uses a combination of the .keyUp() jQuery method to see if the content has changed. And then I update every 5 seconds because I don't want the form getting submitted every time it's changed!!!!
var savePost = false;
jQuery(document).ready(function() {
setInterval('autoSave()', 5000)
$('input, textarea').keyup(function(){
if (!savePost) {
savePost = true;
}
})
})
function autoSave() {
if (savePost) {
savePost = false;
$('#post_submit, #task_submit').click();
}
}
I know it will fire even if the content hasn't changed but it was easier that hardcoding which keys I didn't want it to work for.

How come I can't bind this to JQuery?

$("input").bind("keyup",function(e1){
if(e1.keyCode==13){
return false;
}
});
I want to return false everytime someone pushes "enter" inside one of my text boxes.

k i tried it out this one works
$("textarea").bind("keypress", function(e) {
if (e.keyCode == 13) return false;
});
try with keycode 13 too

See jquery api
Your answer:
$('input').submit(function() {
return false;
});