show() не работает

Question

Я пытаюсь отобразить загрузчик, когда пользователь нажимает кнопку отправки. Я попытался реализовать предоставленное решение here, но оно не работает.

Я подтверждено, что функция вызывается, и что цель DIV был найден с помощью JQuery, бросая в боевой готовности (spinner.innerHTML) следующим образом:

<script type="text/javascript"> 
    $(document).ready(function() { 
     var spinner = $("div#spinner"); 
    }); 
    var spinnerVisible = false; 
    function showProgress() { 
     if (!spinnerVisible) { 
      alert(spinner.innerHTML); 
      spinner.show(); 
      spinnerVisible = true; 
     } 
    }; 
    function hideProgress() { 
     if (spinnerVisible) { 
      spinner.hide(); 
      spinnerVisible = false; 
     } 
    }; 
</script> 

Как и следовало ожидать, когда я нажмите на мою кнопку, я получу окно предупреждения с текстом «Загрузка ...», который является текстом из моего div. Однако, если я добавлю второе предупреждение после, позвоните по номеру spinner.show(); не появляется, что заставляет меня поверить, что звонок spinner.show(); вызывает сбой jQuery.

Это мой первый набег на jQuery, поэтому я борюсь с тем, как отлаживать это и узнавать, что ломается.

Answer 1

Основываясь на процедурах отладки, похоже, что в ваш проект не включена библиотека jQuery.

Включите jQuery в своем проекте, чтобы использовать функциональность jQuery.

Answer 2

вы должны правильно определить кок (т.е.. В глобальном)

<script type="text/javascript"> 
    var spinner; 
    $(document).ready(function() { 
     spinner = $("div#spinner"); 
    }); 
    var spinnerVisible = false; 
    function showProgress() { 
     if (!spinnerVisible) { 
      alert(spinner.innerHTML); 
      spinner.show(); 
      spinnerVisible = true; 
     } 
    }; 
    function hideProgress() { 
     if (spinnerVisible) { 
      spinner.hide(); 
      spinnerVisible = false; 
     } 
    }; 
</script> 

Answer 3

Вы пытаетесь получить доступ к переменному спиннеру без рамки к нему в функции.

<script type="text/javascript"> 
     $(document).ready(function() { 
      var spinner = $("div#spinner"); 
     }); 
     var spinnerVisible = false; 
     function showProgress() { 
      var spinner = $("div#spinner"); 
      if (!spinnerVisible) { 
       alert(spinner.innerHTML); 
       spinner.show(); 
       spinnerVisible = true; 
      } 
     }; 
     function hideProgress() { 
      var spinner = $("div#spinner"); 
      if (spinnerVisible) { 
       spinner.hide(); 
       spinnerVisible = false; 
      } 
     }; 
    </script>