We Keep Coding

compare two input values using Jquery

I'm trying to compare two values from a dual input range slider. If the bottom value is equal or greater than the top value, I want to return false. This is to prevent overlap between the two thumbs.
I have used .change to listen for changes. I can then console.log & return the value after it's been updated. I have included the last bit of code in the hope for help. You can see an full almost working version here:
https://fiddle.jshell.net/elliottjb7/fj9ot08v/
Thanks
$("input[type='range'][id='text_box_bottom_range']").change(function() {
var bottom = $("input[type='range'][id='text_box_bottom_range']").val();
console.log("bottom = " + bottom);
return bottom;
});
$("input[type='range'][id='text_box_top_range']").change(function() {
var top = $("input[type='range'][id='text_box_top_range']").val();
console.log("top = " + top);
return top;
});
$("input").blur(function() {
if ($("input[type='range'][id='text_box_bottom_range']").val() > this.val) {
console.log("Bottom is higher than Top");
return false;
} else {
return true;
}
});

this line
if ($("input[type='range'][id='text_box_bottom_range']").val() > this.val) {
should be
if ($("input[type='range'][id='text_box_bottom_range']").val() > $("input[type='range'][id='text_box_top_range']").val()) {

Change your blur event on the input element to
$("input").blur(function() {
if ($('#text_box_bottom_range').val() >= $('#text_box_top_range').val()) {
console.log("bottom is equal or higher than the top");
return false;
} else {
return true;
}
});

$("#text_box_bottom_range").change(function() {
return $(this).val();
});
$("#text_box_top_range").change(function() {
return $(this).val();
});
$("input").blur(function() {
if ($("#text_box_bottom_range").val() => $("#text_box_top_range").val()) {
return false;
} else {
return true;
}
});
This does the correct check where bottom is:
...equal or greater than the top value
Also, the first 2 functions (.change()) are quite redundant for what you are trying to achieve but I've included a better way to write them

Detect if the mouse is over an element

How do I get a pretty simple true/false-statement if the mouse is over a div event = true else event = false
var test = $("#main-nav").on("mouseenter", function (e) {
e.preventDefault();
console.log(e.preventDefault());
return true;
});
if (test === true) {
//do something
} else {
//something different
}

If I understand your question correctly:
if($("#main-nav").is(":hover")) {
//do something
}else{
//something different
}
In pseudo code:
if the cursor is over #main-nav
do something
if it's not
do something else
If you want test to always be set:
var test = false;
$("#main-nav").on("mouseenter", function(e){
e.preventDefault();
test = true;
}).on("mouseleave", function(e){
e.preventDefault();
test = false;
});
This way,
if(test === true) {
//do something
}else{
//something different
}
will always work.

You can have a boolean (true/false) variable that will constantly update by doing this:
var hovering;
$("#main-nav").mouseenter(function(){
hovering = true;
});
$("#main-nav").mouseleave(function(){
hovering = false;
});
So whenever it is called it will tell you if the mouse is within your div:
if (hovering){
// mouse within div
} else {
// mouse not within div
}

If you necessarily need is as a variable:
var test = false;
$("#main-nav").on("mouseenter", function (e) {
test = true;
});
$("#main-nav").on("mouseout", function (e) {
test = false;
});
//....
if (test === true) {
//do something
} else {
//something different
}

JQuery Toggle property contentEditable = "true"

I am using contenteditable="true" in a div
What I want to do it to toggle true and false on this attribute everytime I click on a div.
example:
$( "#mylabel" ).click(function() {
$('#editablediv').attr('contenteditable','false');
});
I tried:
$( "#mylabel" ).toggle(function() {
$('#editablediv').attr('contenteditable','false');
});
but that didn't work
How can I do this?

Try this way:
$( "#mylabel" ).click(function() {
var value = $('#editablediv').attr('contenteditable');
if (value == 'false') {
$('#editablediv').attr('contenteditable','true');
}
else {
$('#editablediv').attr('contenteditable','false');
}
});
Keep me posted, hope this helped

Here is shorter than your shortest (Reusability and Character Count):
function editTheElement() {
var a = "contenteditable";
$(this).attr(a) === 'true' ? $(this).attr(a,'false') : $(this).attr(a, 'true');
}
or still
function editTheElement(e) {
var a = "contenteditable";
e.attr(a) === 'true' ? e.attr(a,'false') : e.attr(a, 'true');
}
or
function editTheElement(e) {
var a = 'contenteditable';
var v= e.attr(a);
e.attr(a,!v);
}
or
function editTheElement(e) {
var a = 'contenteditable';
e.attr(a,!e.attr(a));
}
or
function editTheElement(e) {
e.attr('contenteditable',!e.attr('contenteditable'));
}
JS is fun :)

In 2018 at least, most of these answers aren't working past the first on/off in Chrome 68. It's something with how jQuery or the browser is reading the value of this attribute, because the logic is pretty simple.
The code I found to work was
var el = $("{your selector}")
(el.attr('contenteditable') ?
el.removeAttr('contenteditable') :
el.attr('contenteditable', true));
Demo Fiddle

shortest solution I found:
$('[contenteditable]').attr('contenteditable') === 'true' ?
$('[contenteditable]').attr('contenteditable', 'false') :
$('[contenteditable]').attr('contenteditable', 'true');

$('#mylabel').click(function() {
editable = $('#editablediv').attr('contenteditable');
$('#editablediv').attr('contenteditable', !(editable == 'true'));
});

jquery/javascript: adding an else statement?

I am trying to add an else statement to this piece of javascript so that if a div-1 is clicked once it shows div-2 and if div-1 is clicked again it hides div-2.
Does anyone know how I could do this?
$(function() {
$('.div-1').click(function() {
$('.div-2').show();
return false;
});
});

Try toggle() instead:
$('.div-1').click(function() {
$('.div-2').toggle();
return false;
});

You can add a dummy class and check for it's exixtence.
$(function() {
$('.div-1').click(function() {
var $this = $(this),
$div2 = $('.div-2');
if($this.hasClass('open')) {
$this.removeClass(open');
$div2.hide();
} else {
$this.addClass(open');
$div2.show();
}
return false;
});
});

I totally agree with Jason P's answer that you should be using toggle instead, but in case you actually needed to use an if statement, you can do this:
$('.div-1').click(function() {
if ($('.div-2').is(':visible')) {
$('.div-2').hide();
} else {
$('.div-2').show();
}
return false;
});
jsFiddle

Do something depend on element id with jQuery

I have some function inside click action. I need to stop this function if the last of my html list element will be have some id, so I do this but function does not work... Can you help me?
carousel_controls_buttons.on('click', function(){
var settings_list_last_element_id = settings_menu_element.attr('id') == 'r_00';
if (settings_menu_element.last(id === settings_list_last_element_id)) {
}
else {
renumNext();
}
});

Try changing:
if (settings_menu_element.last(id === settings_list_last_element_id))
to
if (settings_menu_element.last().attr('id') === settings_list_last_element_id)
Edit:
if (settings_menu_element.last().attr('id') === settings_list_last_element_id){
return false;
} else {
renumNext();
}
Or even better:
if (settings_menu_element.last().attr('id') !== settings_list_last_element_id){
renumNext();
}

Your if-statement looks a bit odd. Try something like this instead:
carousel_controls_buttons.on('click', function(){
// Do nothing if last element has a certain id-attribute
if (settings_menu_element.last().attr("id") === 'r_00') {
return false;
}
renumNext();
});