Добавление 2 полей ввода вместе, когда 1 из них пусто

Я работаю над формой кредитной карты, в которой используется JavaScript.

Часто мои клиенты будут присылать мне больше денег, чем я их выставляю, поэтому, чтобы все было легко и не позволяло мне проиграть потенциальные деньги, у меня есть поле " Price которое показывает общую сумму, которую им будет выставлен счет. Теперь я добавил поле Tip которое позволит им добавить к этой цене.

Вот некоторые JavaScript/jQuery, которые у меня есть, что обновляет мое поле цены, когда они вводят значение подсказки...

$('.price_tip').keyup(function() {
  var tip = $('.price_tip').val();
  var price = $('.price').val();
  var total = parseInt(price) + parseInt(tip);
  $('.price').val(total);
});

Это работает довольно хорошо почти за исключением того, что если я удалю все из поля ввода Tip, то поле "Общая цена" станет NaN.

Мне нужно убедиться, что поле "Цена" всегда показывает, по крайней мере, то, что я выставляю платежу моему клиенту, если значение подсказки удалено.

Это где я мог бы помочь?

ОБНОВИТЬ

Вот моя последняя попытка, кажется, работает, я могу удалить все из окна подсказки, и мое полное поле цены не переходит к NaN сейчас. Я обнаружил еще одну проблему, если вводится не числовой элемент, а затем он запутывается.

Я не уверен, как убедиться, что это числовое значение?

$('.price_tip').keyup(function() {
  var tip = $('.price_tip').val();
  if(tip < 1){
    tip = 0;
  }
  var price = $('.price').val();
  var total = parseInt(price) + parseInt(tip);
  $('.price').val(total);
});