2014-12-20 2 views
2

Привет, ребята, у меня есть этот код jquery, который я искал в сети. im new для jquery. код нужно щелкнуть по кнопке для выполнения. мой вопрос в том, как код для выполнения этого jquery на загрузке страницы.Установите код jquery на страницу body onload

<button id="notification-trigger" class="progress-button"> 
         <span class="content">Show Notification</span> 
         <span class="progress"></span> 
        </button> 
<script> 
     (function() { 
      var bttn = document.getElementById('notification-trigger'); 

      // make sure.. 
      bttn.disabled = false; 

      bttn.addEventListener('click', function() { 
       // simulate loading (for demo purposes only) 
       classie.add(bttn, 'active'); 
       setTimeout(function() { 

        classie.remove(bttn, 'active'); 

        // create the notification 
        var notification = new NotificationFx({ 
         message : '<div class="ns-thumb"><img src="img/user1.jpg"/></div><div class="ns-content"><p>Welcome, Nixxx!</p></div>', 
         layout : 'other', 
         ttl : 6000, 
         effect : 'thumbslider', 
         type : 'notice', // notice, warning, error or success 
         onClose : function() { 
          bttn.disabled = false; 
         } 
        }); 

        // show the notification 
        notification.show(); 

       }, 1200); 

       // disable the button (for demo purposes only) 
       this.disabled = true; 
      }); 
     })(); 
</script> 

я хочу что-то вроде этого:

<html> 
<head> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
</head> 
<body onload="myFunction()"> 

<h1>Hello World!</h1> 

<script> 
function myFunction() { 
    $("#div1").fadeToggle(); 
    $("#div2").fadeToggle("slow"); 
    $("#div3").fadeToggle(3000); 
} 
</script> 

</body> 
</html> 

пожалуйста, помогите спасибо!

(Под редакцией я включаю кнопку, которую нужно щелкнуть до запуска скрипта.) Я хочу, чтобы этот код выполнялся каждый раз, когда я загружаю/обновляю страницу, а не нажав кнопку. Спасибо за помощь!

+0

Я думаю, что при копировании кода, вы забыли скопировать долларовый знак $ в начале функции. :-) – Eric

+0

любопытно, с какими проблемами вы сталкиваетесь, код должен работать, как показано во второй версии, хотя 'onload' не является предпочтительным. Подход jQuery – charlietfl

+0

код сценария говорит, что мне нужно нажать кнопку до того, как код будет выполнен. – Nixxx

ответ

3

Используйте следующий код. Он работает так же, как функция onload() функции Vanilla Javascript.

<script> 
    // $(function(){}); Wrapper acts as the document.ready of vanilla javascript 
    $(function(){ 

     //call myfunction() onload; 
     myFunction(); 

     //functions to execute goes in here 
     function myFunction() { 
      $("#div1").fadeToggle(); 
      $("#div2").fadeToggle("slow"); 
      $("#div3").fadeToggle(3000); 

      //call button action instead of click 
      btnFunction(); 
     } 

    var bttn = document.getElementById('notification-trigger'); 

    bttn.disabled = false; 

    function btnFunction() { 

    classie.add(bttn, 'active'); 
    setTimeout(function() { 

     classie.remove(bttn, 'active'); 

     var notification = new NotificationFx({ 
      message : '<div class="ns-thumb"><img src="img/user1.jpg"/></div><div class="ns-content"> <p>Welcome, Nikko Zabala!</p></div>', 
      layout : 'other', 
      ttl : 6000, 
      effect : 'thumbslider', 
      type : 'notice', // notice, warning, error or success 
      onClose : function() { 
       bttn.disabled = false; 
      } 
    }); 
     notification.show(); 

    }, 1200); 

    }; 

    }); 
</script> 
+0

Вот немного более подробная, но читаемая версия: '$ (document) .ready (function() {});' –

+0

как я установлю ее писать на ? – Nixxx

+0

как я напишу этот код, как этот – Nixxx

1

использование:

<script> 
    $(document).ready(function(){ 

     myFunction() 
     // put your code here; 
    }); 



    function myFunction() { 
// your code 
     } 
function btnFunction(){ 
// your code 
} 

</script> 
Смежные вопросы