Categories
JavaScript Answers

How to use the hover and class selector with jQuery?

Sometimes, we want to use the hover and class selector with jQuery.

In this article, we’ll look at how to use the hover and class selector with jQuery.

How to use the hover and class selector with jQuery?

To use the hover and class selector with jQuery, we can call the hover method.

For instance, we write:

<div id="menu">
  <div class="menuItem"><a href=#>Bla</a></div>
  <div class="menuItem"><a href=#>Bla</a></div>
  <div class="menuItem"><a href=#>Bla</a></div>
</div>

to add some elements.

Then we write:

  $('.menuItem').hover(function() {
      $(this).css('background-color', 'yellow');
    },
    function() {
      $(this).css('background-color', 'white');
    });

to select the elements with class menuItem and call hover on them to do something on hover in and out respectively.

When we hover into the element, we set the background color to yellow with css.

When we hover out of the element, we set the background color to white with css.

Conclusion

To use the hover and class selector with jQuery, we can call the hover method.

Categories
JavaScript Answers

How to validate number of days in a given month with JavaScript?

Sometimes, we want to validate number of days in a given month with JavaScript.

In this article, we’ll look at how to validate number of days in a given month with JavaScript.

How to validate number of days in a given month with JavaScript?

To validate number of days in a given month with JavaScript, we can write our own function to check the number of days of a given month.

For instance, we write:

const daysInMonth = (m, y) => {
  switch (m) {
    case 1:
      return (y % 4 == 0 && y % 100) || y % 400 == 0 ? 29 : 28;
    case 8:
    case 3:
    case 5:
    case 10:
      return 30;
    default:
      return 31
  }
}

const isValid = (d, m, y) => {
  return m >= 0 && m < 12 && d > 0 && d <= daysInMonth(m, y);
}

console.log(isValid(20, 1, 2022))
console.log(isValid(30, 1, 2022))

to define the daysInMonth function that takes month m and year y as parameters.

m is between 0 and 11 where 0 is January and 11 is December.

In the function, we check if February is in a leap year.

If it is, 23 return 29 and 28 otherwise.

For the other months, we check whether the month has 30 or 31 days.

Then we define the isValid function that takes day d, month m and year y.

In the function, we check if m is between 0 and 11, and d is in the valid range for the month.

Therefore, the first log is true and the 2nd is false.

Conclusion

To validate number of days in a given month with JavaScript, we can write our own function to check the number of days of a given month.

Categories
JavaScript Answers

How to get a fraction portion of a float number with JavaScript?

Sometimes, we want to get a fraction portion of a float number with JavaScript.

In this article, we’ll look at how to get a fraction portion of a float number with JavaScript.

How to get a fraction portion of a float number with JavaScript?

To get a fraction portion of a float number with JavaScript, we can use the % operator to get the remainder of the number divided by 1.

For instance, we write:

const frac = (f) => {
  return f % 1;
}
console.log(frac(123.45))

to define the frac function that takes the number f.

And we return the remainder of f divided by 1 with f % 1.

Therefore, the console log should log 0.45000000000000284.

Conclusion

To get a fraction portion of a float number with JavaScript, we can use the % operator to get the remainder of the number divided by 1.

Categories
JavaScript Answers

How to check for strings with only numbers and dot with JavaScript?

Sometimes, we want to check for strings with only numbers and dot with JavaScript.

In this article, we’ll look at how to check for strings with only numbers and dot with JavaScript.

How to check for strings with only numbers and dot with JavaScript?

To check for strings with only numbers and dot with JavaScript, we can call the JavaScript string match method to return matches of the pattern.

For instance, we write:

const validate = (s) => {
  const rgx = /^[0-9]*\.?[0-9]*$/;
  return s.match(rgx);
}
console.log(validate('123.45'))
console.log(validate('foo'))

We define the validate function that has the rgx regex that matches strings with digits and dots.

And we call match with rgx to return the matches of the digit and dot pattern found in string s.

Therefore, we get ['123.45', index: 0, input: '123.45', groups: undefined] and null logged respectively.

Conclusion

To check for strings with only numbers and dot with JavaScript, we can call the JavaScript string match method to return matches of the pattern.

Categories
JavaScript Answers

How to disable Ctrl + F of find in page with JavaScript?

Sometimes, we want to disable Ctrl + F of find in page with JavaScript.

In this article, we’ll look at how to disable Ctrl + F of find in page with JavaScript.

How to disable Ctrl + F of find in page with JavaScript?

To disable Ctrl + F of find in page with JavaScript, we can attach a keydown event listener.

And then we can listen for key with key code 114 or press of the control key and key with key code 70 and prevent the default action in either case.

To do this, we write:

window.addEventListener("keydown", (e) => {
  if (e.keyCode === 114 || (e.ctrlKey && e.keyCode === 70)) {
    e.preventDefault();
  }
})

to attach a keydown event listener with window.addEventListener.

Then we check for control key press with e.ctrlKey and check for regular key press with e.keyCode.

e.preventDefault prevents the search box from showing.

Conclusion

To disable Ctrl + F of find in page with JavaScript, we can attach a keydown event listener.

And then we can listen for key with key code 114 or press of the control key and key with key code 70 and prevent the default action in either case.