JQuery DataTring Var возвращается неопределенным

Question

Я искал на SO и не смог найти подходящий ответ.

Очень просто.Я определяю переменные с помощью отправки формы:

var first_name=jQuery("#contact_first_name_1").val();
var last_name=jQuery("#contact_last_name_1").val();
var email=jQuery("#contact_email_1").val(); 

Затем определяю «dataString»

var dataString =
'first_name='+ first_name + 
'&last_name=' + last_name + 
'&email=' + email + 

Но возникают проблемы, если поле формы остается пустым, возвращается «неопределенное».

Я пробовал это, но это не работает:

if (last_name != undefined) {
   '&last_name=' + last_name + 
}

Я знаю, что это просто, но просто не могу получить правильный код для работы на этом примере.Спасибо!

Answer 1

! == ''

Значение пустого входа - '' Используйте троицы, чтобы изменить значение на '', когда оно ''.

Демо

var dataString = '';
var clean = '';

$('#main').on('change', function() {
  var first_name = $('#contact_first_name_1').val();
  var last_name = $("#contact_last_name_1").val();
  var email = $("#contact_email_1").val();
  var mobile = $("#contact_mobile_1").val();

  var first = first_name !== '' ? `&first_name=${first_name}` : '';
  var last = last_name !== '' ? `&last_name=${last_name}` : '';
  var mail = email !== '' ? `&email=${email}` : '';
  var tel = mobile !== '' ? `&mobile=${mobile}` : '';

  dataString = `dataString: ${first}${last}${mail}${tel}`;

  console.log(dataString);
});
$('form').on('submit', function(e) {
  e.preventDefault();
  var clean = $(this).serialize();
  console.log(`clean: ${clean}`);
  this.submit();
});

<form id='main' name='main' action='https://httpbin.org/post' method='post' target='response'>
  <input id='contact_first_name_1' name='first'>
  <input id='contact_last_name_1' name='last'>
  <input id='contact_email_1' type='email' name='email'>
  <input id='contact_mobile_1' type='tel' name='mobile'>
  <input type='submit'>
</form>
<iframe src='about:blank' name='response'></iframe>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>