How to check inputMask field for empty value?

Question

WordPress

There is an input field with the InputMask plugin connected, I need to check the field, if the field is empty or the required number of digits are not entered, then remove the focus class. If you entered the required number of digits, then add the focus class.

At this stage, the script works for me, with focus in the field, the hint rises, if the field is empty, the hint falls back. The problem is that when you enter 1 number in the field with the phone number, where the plugin works, the hint remains at the top. Since the field automatically removes 1 digit if you left the input field.

Sample script and additional code of mine:

https://codepen.io/pit6262/pen/ZEYEBbZ

Answer 1

Hello!
Pretty good resource for doing what you want:
https://www.smashingmagazine.com/2016/03/advanced-...
It's possible that there are ready-made plugins... For example, there is a filtering plugin for the woocomer
https:/ /ru.wordpress.org/plugins/woocommerce-produ...
https://ru.wordpress.org/plugins/yith-woocommerce-...

Answer 2

.blur(function(){
    var label = $(this).prev('.label');
    var value = $(this).val();
    var full = value.replace(/\+7\(\d{3}\) \d{3} \d{4}/g, "")=="" ? true: false;

    if(value == '' || !full){
      label.stop().css({ 'top': '1rem', });
      $(this).parent().removeClass('focus')
    }