Een stelletje code werkt niet en ik probeer te identificeren waar het probleem leugens is, maar console.log()is niet loggen in chrome dev-tools, ik doe het correct?
$(window).scroll(function() {
$('section').each(function(){
var id='#'+$(this).attr('id'),
off=$(id).offset().top,
hei=$(id).height(),
winscroll=$(window).scrollTop(),
dif=hei+off-($(window).height());
if (winscroll >= off && winscroll<=dif) {
console.log('first broken');
$(id+' .sticky').removeClass('abs').addClass('fix');
} else if (winscroll > dif){
console.log('second broken');
$(id+' .sticky').removeClass('fix').addClass('abs');
} else {
console.log('third broken');
$(id+' .sticky').removeClass('fix abs');
} });
});
Volledige code toevoegen
$(document).ready(function() {
// If a browser supports 3D transforms use the fancy menu if it doesn't, use standard accordion menu instead
if($('html').hasClass('csstransforms3d')){
$( "#mp-menu" ).removeClass( "snap-drawers" ).addClass( "mp-menu" );
$('nav ul li ul').css('border-bottom','1px solid rgba(255, 255, 255, .05)');
$('nav ul li ul').css('background','none');
// Insert elements where necessary to create the right structure
$('#mp-menu').wrapInner('<div class="mp-level" />');
$('#mp-menu').find('li > ul').wrap('<div class="mp-level" />');
$("#mp-menu ul li .mp-level").prepend(function () {
return '<span class="menu-title">' + $(this).prev().text() + '</span> <a class="ico mp-back" href="#">Back</a>';
});
// load in necessary JS files
$.getScript('http://176.32.230.2/baodev.com/cjo/wp-content/themes/CJO/js/multi-level-menu.js');
} else {
// load in necessary JS files
$.getScript( "http://176.32.230.2/baodev.com/cjo/wp-content/themes/CJO/js/jquery.navgoco.min.js", function() {
$("#demo1").navgoco({accordion: true});
});
$.getScript( "http://176.32.230.2/baodev.com/cjo/wp-content/themes/CJO/js/snap.min.js", function() {
// Snapper settings
var snapper = new Snap({
element: document.getElementById('scroller'),
disable: 'right',
maxPosition: 291
});
var addEvent = function addEvent(element, eventName, func) {
if (element.addEventListener) {
return element.addEventListener(eventName, func, false);
} else if (element.attachEvent) {
return element.attachEvent("on" + eventName, func);
}
};
// Toggle button
addEvent(document.getElementById('trigger'), 'click', function(){
if( snapper.state().state=="left" ){
snapper.close();
$( ".menu-trigger" ).removeClass( "active" );
} else {
snapper.open('left');
$( ".menu-trigger" ).addClass( "active" );
}
});
addEvent(document.getElementById('scroller'), 'click', function(){
if( snapper.state().state=="left" ){
$( ".menu-trigger" ).removeClass( "active" );
}
});
/* Prevent Safari opening links when viewing as a Mobile App */
(function (a, b, c) {
if(c in b && b[c]) {
var d, e = a.location,
f = /^(a|html)$/i;
a.addEventListener("click", function (a) {
d = a.target;
while(!f.test(d.nodeName)) d = d.parentNode;
"href" in d && (d.href.indexOf("http") || ~d.href.indexOf(e.host)) && (a.preventDefault(), e.href = d.href)
}, !1)
}
})(document, window.navigator, "standalone");
});
} // end if
fitHeight();
$(window).scroll(function() {
$('section').each(function(){
var id='#'+$(this).attr('id'),
off=$(id).offset().top,
hei=$(id).height(),
winscroll=$(window).scrollTop(),
dif=hei+off-($(window).height());
console.log('msj');
if (winscroll >= off && winscroll<=dif) {
$(id+' .sticky').removeClass('abs').addClass('fix');
} else if (winscroll > dif){
$(id+' .sticky').removeClass('fix').addClass('abs');
} else {
$(id+' .sticky').removeClass('fix abs');
}
});
});
});
// Trigger FitHeight on browser resize
$(window).resize(fitHeight);
bewerken
Sommige bits van de volledige code (hierboven) verwijzen naar andere JS-bestanden en code Retourneert geen fouten wanneer deze wordt uitgevoerd met deze aanwezige bestanden. Na het oplossen van problemen zie ik het consolesbericht vóór de scroll-functie, maar ik zie het consolesbericht niet binnen de scroll-functie.
fitHeight();
console.log('About to bind scroll effects'); // I SEE THIS MESSAGE
$(window).scroll(function() {
console.log("scroll bound, now loop through sections"); //BUT NOT THIS ONE
$('section').each(function(){
Antwoord 1, autoriteit 100%
Het lijkt erop dat je JavaScript-logboeken hebt verborgen of hebt opgegeven dat je alleen fouten of waarschuwingen wilt zien. Open de ontwikkelaarstools van Chrome en ga naar het tabblad Console. Onderaan wil je ervoor zorgen dat JavaScript is aangevinkt en ook dat je “Alle”, “Logs” of “Debug” hebt geselecteerd.
In de afbeelding hierboven heb ik JavaScript, Netwerk, Logging, CSS en Overig aangevinkt en “Alle” geselecteerd.
Een ander potentieel probleem kan zijn dat uw functie $(window).scroll()niet is verpakt in een functie .ready()(zoals gedocumenteerd door hier):
$(document).ready(function() {
$(window).scroll(function() {
...
});
});
Als je je code in JSFiddle plakt en wat dummy-inhoud geeft, werkt je code prima: JSFiddle-demo.
Bewerken:
De vraag is bewerkt. De nieuwe code geeft twee fouten:
Uncaught ReferenceError: fitHeight is niet gedefinieerd
Uncaught TypeError: kan eigenschap ‘addEventListener’ van null niet lezen
Hierdoor stopt de code met de uitvoering voordat een console.log-aanroep wordt bereikt.
Antwoord 2, autoriteit 80%
In mijn geval werden niet alle consoleberichten weergegeven omdat ik een tekenreeks had achtergelaten in het tekstvak “filter”.
Verwijder het filter door op de X te klikken, zoals weergegeven:
Antwoord 3, autoriteit 15%
Ik voel me een beetje dom hierover, maar laat dit een les zijn voor iedereen…Zorg ervoor dat je de juiste selector target!
Eigenlijk registreerde de console niets omdat dit specifieke codefragment het scrollgebied van mijn venster probeerde te grijpen, terwijl mijn code in feite anders was ingesteld om in plaats daarvan een hele DIV te scrollen. Zodra ik veranderde:
$(window).scroll(function() {
naar dit:
$('#scroller').scroll(function() {
De console is begonnen met het loggen van de juiste berichten.
Antwoord 4, autoriteit 9%
Klik op de herstelknop. console.logbegint te werken.
Antwoord 5, autoriteit 3%
In mijn geval was ik een Polymer WebComponent aan het ontwikkelen, die is opgenomen met behulp van <link rel="import">in het HTML-hoofddocument. Het blijkt dat het WebComponent HTML-bestand om de een of andere reden in de cache werd opgeslagen, ook al had ik het veranderd sinds de gecachte versie.
Om het op te lossen opende ik de ontwikkelaarsconsole (in Chrome), klikte met de rechtermuisknop op de herlaadpijl naast de URL-balk en selecteerde “Cache leegmaken en opnieuw laden” – probleem opgelost.
Antwoord 6, autoriteit 3%
Het was omdat ik eerder ‘Logboeken’ had uitgeschakeld in de lijst met vakken. 
Antwoord 7
Ik had net hetzelfde probleem waarbij geen van mijn consoleberichten werd weergegeven. Het was simpelweg omdat ik de nieuwe Edge (Chromium-gebaseerde) browser op Windows 10 gebruikte. Mijn consoleberichten worden niet weergegeven, terwijl Chrome dat wel doet. Ik vermoedde dat het een probleem was met Edge omdat ik nog een vreemd probleem had met Edge omdat het strings met enkele aanhalingstekens en dubbele aanhalingstekens anders behandelde.
Antwoord 8
Overweeg een meer pragmatische benadering van de kwestie van “het correct doen”.
console.log("about to bind scroll fx");
$(window).scroll(function() {
console.log("scroll bound, loop through div's");
$('div').each(function(){
Als beide logs correct worden uitgevoerd, dan zit het probleem waarschijnlijk in uw var-declaratie. Om dat te debuggen, kunt u overwegen het op te splitsen in verschillende regels:
var id='#'+$(this).attr('id');
console.log(id);
var off=$(id).offset().top;
var hei=$(id).height();
var winscroll=$(window).scrollTop();
var dif=hei+off-($(window).height());
Als je dit doet, tenminste tijdens het debuggen, kan het zijn dat de var idniet gedefinieerd is, wat fouten veroorzaakt in de rest van de code. Is het mogelijk dat sommige van uw div-tags geen id’s hebben?
Antwoord 9
Misschien heb je de filterfunctie in de console gebruikt die alles verbergt dat niet overeenkomt met je zoekopdracht. Verwijder de zoekopdracht en uw berichten worden weergegeven.
Antwoord 10
Je hoeft alleen de rechteroptie te selecteren om de logberichten weer te geven van de optie aan de linkerkant onder het consoletabblad. U kunt verwijzen naar de schermafbeelding.
Antwoord 11
Als een compleet nieuwe gebruiker van javascript, had ik hier hetzelfde probleem. De fout die ik maakte, was dat ik gebruikte:
<script type="text.javascript">
console.log("bla bla bla");
</script>
in plaats van:
<script>
console.log("bla bla bla");
</script>
met behulp van de
type=”text.javascript”
het resultaat was dat het logboek niet in de console werd geproduceerd.
Antwoord 12
In mijn geval werd het veroorzaakt door de console.groupCollapsed().
En samengevouwen berichten worden blijkbaar niet gedetecteerd door ctrl+f.
Het is soms eng om onbekende code bij te houden…
Het heeft zelfs het uitzonderingsbericht samengevouwen, waardoor ik die console.log‘s op de eerste plaats heb gezet ^_^
Antwoord 13
als je $ parameter gebruikt in console.log binnen html, dan werken enkele aanhalingstekens(‘) en dubbele qoutes(“”) niet.
gebruik aanhalingstekens zoals ()
voorbeeld:
console.log(${address});
Dit helpt bij het gebruik van $parameter en bij iedereen die problemen ondervindt in console.log.