2017-10-17 3 views
0

Ich arbeite an einer Notify JS Notification-Option. Ich habe es versucht, aber es funktioniert nicht. Wenn ich Style und Klassennamen entferne funktioniert es gut.Benachrichtigen, dass JS nicht funktioniert

<style> 

    .notifyjs-happyblue-base { 
     white-space: nowrap; 
     background-color: lightblue; 
     padding: 5px; 
    } 
    .notifyjs-happyblue-superblue { 
     color: white; 
     background-color: blue; 
    } 
    </style> 
<script src="http://code.jquery.com/jquery-3.0.0.min.js"></script> 
<script src="notify.js"></script> 
<script src="notify.min.js"></script> 

<script> 

     $(function(){ 
      $.notify("Your Break is Approved", { 
      style: 'happyblue', 
      className: 'superblue' 
      title: "E-Contact Application" 
      }); 
    }); 
</script> 
+3

Sie benötigen ein Komma nach dem Klassennamen. d. h. 'className: 'superblue',' –

+0

@ p.s.w.g Ich habe ein Komma eingefügt es funktioniert nicht – Maha

+2

* Es funktioniert nicht * ist nicht sehr beschreibend. Siehst du einen Fehler oder unerwartete Ergebnisse? Abgesehen vom Tippfehler ist das einzige mögliche Problem, das ich sehen kann, dass Sie 'notify.js' * und *' notify.min.js' importieren - typischerweise ist 'x.min.js' nur eine verkleinerte Version von' x.js', also müssen Sie beide nicht hinzufügen. Ich empfehle, ein Snippet oder [fiddle] (https://jsfiddle.net) zusammenzufügen, um das Problem zu demonstrieren, das Sie sehen. –

Antwort

2

Schritt eins, geben Sie einfach das Skript einmal ... Sie sind einschließlich der uncomprssed Version und die minimierte Version ...

<script src="http://code.jquery.com/jquery-3.0.0.min.js"></script> 
<!--<script src="notify.js"></script> DITCH THIS LINE --> 
<script src="notify.min.js"></script> 

Schritt zwei, stellen Sie sicher, dass Ihre Syntax korrekt ist ..

. sie alle zusammen
$(function(){ 
    $.notify("Your Break is Approved", { 
     style: 'happyblue', 
     className: 'superblue', // <-- just a comma, but really important 
     title: "E-Contact Application" 
    }); 
}); 

Putting ...

<script src="https://code.jquery.com/jquery-3.0.0.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/notify/0.4.2/notify.min.js"></script> 
 
<script> 
 
    $.notify.addStyle('happyblue', { 
 
    html: "<div>☺<span data-notify-text/>☺</div>", 
 
    classes: { 
 
     base: { 
 
      "white-space": "nowrap", 
 
      "background-color": "lightblue", 
 
      "padding": "5px" 
 
     }, 
 
     superblue: { 
 
      "color": "white", 
 
      "background-color": "blue" 
 
     } 
 
     } 
 
    }); 
 

 

 
    $.notify("Your Break is Approved", { 
 
     style: 'happyblue', 
 
     className: 'superblue', // <-- just a comma, but really important 
 
     title: "E-Contact Application" 
 
    }); 
 
</script>

0

Verwendung $.notify.addStyle(... vor dem $.notify("Message",...

$.notify.addStyle('happyblue', { 
 
    html: "<span><span data-notify-text/></span>", 
 
    classes: { 
 
     base: { 
 
      "white-space": "nowrap", 
 
      "background-color": "lightblue", 
 
      "padding": "5px" 
 
     }, 
 
     superblue: { 
 
      "color": "white", 
 
      "background-color": "blue" 
 
     } 
 
     } 
 
}); 
 

 
$.notify("Message", { 
 
    style: 'happyblue', 
 
    className: 'superblue' 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://rawgit.com/notifyjs/notifyjs/master/dist/notify.js"></script>