2014-10-23 3 views
0

Я пытаюсь получить счетчик javascript для работы с отправкой. Я использую spin.js и код, который я нашел здесь в качестве отправной точки.Запуск загрузки страницы Spinner on Form Submit

У нас есть 2 варианта для запуска, что Java:

  1. , когда форма была отправлена ​​# подать форма
  2. при нажатии на кнопку в последний раз: уникальный класс кнопки является .next-Submit.

Я не уверен, где я ошибся.

И еще, что я не понимаю, нужен ли мне div #spinner в html страницы, или если это сгенерировано динамически.

<script src="http://www.purevisionmethod.com/js/spin.min.js"></script> 
 

 
<script> 
 
$(function() { 
 
// Remember to use 'var' 
 
var spinner_div = $('#spinner').get(0), 
 
    spinner, 
 
    opts = { 
 
lines: 16, // The number of lines to draw 
 
length: 23, // The length of each line 
 
width: 5, // The line thickness 
 
radius: 30, // The radius of the inner circle 
 
corners: 100, // Corner roundness (0..1) 
 
rotate: 0, // The rotation offset 
 
direction: 1, // 1: clockwise, -1: counterclockwise 
 
color: '#000', // #rgb or #rrggbb or array of colors 
 
speed: 1, // Rounds per second 
 
trail: 100, // Afterglow percentage 
 
shadow: true, // Whether to render a shadow 
 
hwaccel: true, // Whether to use hardware acceleration 
 
className: 'spinner', // The CSS class to assign to the spinner 
 
zIndex: 2e9, // The z-index (defaults to 2000000000) 
 
top: '50%', // Top position relative to parent 
 
left: '50%' // Left position relative to parent 
 
    }, 
 
    showSpinner = function() { 
 
     // Add 'lightbox-is-open' and 'lightbox-is-fixed' classes to HTML 
 
     $('html').addClass('lightbox-is-open lightbox-is-fixed'); 
 

 
     // Remove 'hidden' class from '.glasspane' 
 
     $('.glasspane').removeClass('hidden'); 
 

 
     // Show spinner 
 
     if(spinner == null) { 
 
      spinner = new Spinner(opts).spin(spinner_div); 
 
     } else { 
 
      spinner.spin(spinner_div); 
 
     } 
 

 
     // Submit form after 500ms 
 
     var timer = window.setTimeout(function() { 
 
      $('form').submit(); 
 
     }, 500); 
 
    }; 
 

 
// Bind events 
 
$('form').on('submit', function(e) { 
 
    e.preventDefault(); 
 
    showSpinner(); 
 
}); 
 
$('.next-sbumit').on('click', function(e) { 
 
    e.preventDefault(); 
 
    showSpinner(); 
 
}); 
 
$('select').on('change', showSpinner); 
 
}); 
 
</script>

Спасибо за вашу помощь !!

+1

У вас есть какой-либо код? Вы видите ошибки? Есть ли у вас HTML-код, который вы можете включить? – pmahomme

+0

по html, вы имеете в виду ссылку на страницу? Я не вижу никаких ошибок, это нечетная часть ... – Veit

+0

Да, если вы можете предоставить основной HTML-код, с которым вы работаете со сценарием, это было бы полезно. Кроме того, чтобы уточнить, «java» вы имеете в виду Javascript, выше? – pmahomme

ответ

0

Я не вижу каких-либо ошибок, но одна вещь, которую я заметил, орфографическая ошибка здесь:

$('.next-sbumit').on('click', function(e) { 
    e.preventDefault(); 
    showSpinner(); 
}); 

следующего sbumit должны, вероятно, будет next- суб мит - правильно?

+0

спасибо! какой дислексический момент ... – Veit

+0

добро пожаловать, это исправить? – pmahomme