У меня есть две отдельные функции: одна собирает текст формы, другая переключает отображение изображения.Я не могу получить значения из другой переменной

Question

Примечание: я не эксперт по javascript, поэтому, пожалуйста, будьте добры.Я продолжаю получать значение Null из переменной, которая, по моему мнению, вызвана событием DOM.У меня есть две функции.Каждый смотрит на текст формы, присутствует ли он, если нет, он извлекает из другой существующей переменной, поэтому он никогда не должен быть пустым / нулевым.Однако, когда я пытаюсь вытащить эти результаты переменных в другую функцию, она возвращает Null.Я пытаюсь создать форму, в которой пользователь вводит имя файла (имя картинки), а скрипт вставляет остальную часть строки вокруг этого имени файла.Позволяет пользователю не вводить полный путь URL-адреса, особенно HTML-код.Это работает, если я помещаю переменные вручную как текстовые строки, я просто не могу получить ничего, кроме нуля, из этой переменной внутри этой функции.

Я думал, что это возможно из-за события DOM, но яперепробовал все, что смог найти здесь безуспешно.Я даже пытался сделать глобальную переменную, которая не помогла.Я пытаюсь объединить текст до и после этой другой переменной данных.Если я помещу эти другие переменные в виде строкового текста, он будет работать нормально, но всякий раз, когда я пытаюсь вытянуть другую переменную за пределы функции, я получаю значение Null.В этот момент я украсил свою яву.Я возвращался к этому в последние несколько дней, пытаясь что-то другое, но безуспешно.Спасибо.

    // This checks for radio toggle and writes html(var string) if on
function output_headshot() {

var text1 = "<td border=\"0\" cellpadding=\"0\" cellspacing=\"0\"><br><img src=\"https://url/Headshots/";
var text2 = headshot_path;
var text3 = "\" width=\"154\" height=\"154\"></td>";
var headshot_html = text1 + text2 + text3;

$(".headshot_element").show();
  $(".headshot_element").html(headshot_html);
  // Monitor logo option to hide/show
  $(".input_headshot input[type=radio]").on("change", function(){
    if(document.getElementById('headshot_show').checked) {      
      $(".headshot_element").show();
      $(".headshot_element").html(wpe_headshot_html);
    } else if(document.getElementById('headshot_hide').checked) {
      $(".headshot_element").hide();
      $(".headshot_element").html('');
    }
    updateHtmlSigRaw()
  });
}
output_headshot();

// This looks at form contents, if empty pulls from another static variable employee.headshot_location
// This will display the text string on HTML using this: <span class="output_headshot_location"></span>

$(".input_headshot_location input").on("change keyup paste", function(){
  var headshot_location = $(this).val();

  if(headshot_location) {
    $("span.output_headshot_location").html(headshot_location)
  } else {
    $("span.output_headshot_location").html(employee.headshot_location);
  }
  updateHtmlSigRaw()
});

РЕДАКТИРОВАТЬ: Добавлено для контекста

// Place raw HTML of each version into appropriate containers
function updateHtmlSigRaw() {
  get_html_signature_full_visual = document.getElementById("signature-full-visual").innerHTML;
  get_html_signature_horizontal_visual = document.getElementById("signature-horizontal-visual").innerHTML;
  $("#signature-full-html textarea").text(get_html_signature_full_visual);
  $("#signature-horizontal-html textarea").text(get_html_signature_horizontal_visual);
}

Это начало нормальных переменных.

// Start Normal variables
var employee = {
    headshot_location: "TimC-Rounded-SQ-SM.png"
}

Вот как я размещаю вHTML для изображения, чтобы отключить.

<td height="237" valign="middle" style="padding:0px 10px 0px 0;">
<div class="headshot_element" onClick="document.location = 'https://url'" border="0" cellpadding="0" cellspacing="0" >

Далее идет форма для ввода.

<div class="input_headshot_location form-group">
<label>Headshot Location</label>
<input class="form-control" type="text" name="headshot_location" placeholder="Enter Full Filename">
</div>

Ожидается извлечение строки из переменной для добавления / объединения с другими статическими строковыми переменнымивставить HTML на страницу, используя класс Span или Div.