не входит в функцию JQuery

Question

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

Нужно ли что-то делать на загрузке страницы в коде? Внизу я показываю функцию;

<script type="text/javascript"> 
    var index = 0; 
    var images = [ 
     'child.jpg', 
     'girl.gif', 
     'sponsor.jpg' 
    ]; 

    $('#Image1').attr('src', 'Resources/ChildrenImages/' + images[0]); 

    setInterval(change_image, 5000); 

    function change_image() { 
     index++; 
     if (index >= images.length) 
      index = 0; 
     $('#Image1').attr('src', 'Resources/ChildrenImages/' + images[index]); 
    } 
</script> 

Answer 1

Первое, что нужно сделать, это запустить свой код JQuery послеDOM готов событие так

<script type="text/javascript"> 
    var index = 0; 
    var images = [ 
     'child.jpg', 
     'girl.gif', 
     'sponsor.jpg' 
    ]; 

$(function(){ // added this line 

    $('#Image1').attr('src', 'Resources/ChildrenImages/' + images[0]); 

    setInterval(change_image, 5000); 

     function change_image() { 
       index++; 
      if (index >= images.length) index = 0; 

      $('#Image1').attr('src', 'Resources/ChildrenImages/' + images[index]); 

    } 

}); // and this one 
</script> 

Вторая вещь, чтобы убедиться, что библиотека JQuery включена в страницу (перед тем приведенный выше код)

Answer 2

Возможно, сценарий выполняется до завершения загрузки DOM. Попробуйте окружающие коды с документом готовым:

<script type="text/javascript"> 
    $(document).ready(function() { 
     /* your code as you posted */ 
    }); 
</script> 

Смотрите документацию для объяснения вам это нужно: http://api.jquery.com/ready/

Answer 3

Попробуйте выполнить сценарий после того, как DOM готов:

<script type="text/javascript"> 
    $(document).ready(function() { 
     var index = 0; 
     var images = ['child.jpg', 'girl.gif', 'sponsor.jpg']; 

     $('#Image1').attr('src', 'Resources/ChildrenImages/' + images[0]); 
     setInterval(change_image, 5000); 

     function change_image() { 
      index++; 
      if (index >= images.length) index = 0; 
      $('#Image1').attr('src', 'Resources/ChildrenImages/' + images[index]); 
     } 
    }); 
</script>