堆棧內存溢出
  簡體   English   中英

Console.log 根本不工作

[英]Console.log not working at all

 原文  2013-10-29 15:09:25  3   15    javascript/ debugging/ console/ google-chrome-devtools

問題描述

一堆代碼不起作用，我試圖確定問題出在哪里，但console.log()沒有在 Chrome 開發工具中記錄任何結果，我做對了嗎？

$(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');
            }   });
        });

編輯完整代碼添加

$(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);

編輯

完整代碼的某些部分（以上）引用了其他 JS 文件，並且在存在這些文件的情況下運行時，代碼不會返回任何錯誤。 故障排除后，我在滾動功能之前看到控制台消息，但在滾動功能中沒有看到控制台消息。

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(){

15 個解決方案

解決方案1
 77  2013-10-29 15:12:16

聽起來您要么隱藏了 JavaScript 日志，要么指定只想查看錯誤或警告。 打開 Chrome 的開發人員工具並轉到控制台選項卡。 在底部，您要確保勾選 JavaScript，並確保您選擇了“全部”、“日志”或“調試”。

示例截圖

在上圖中，我勾選了 JavaScript、網絡、日志記錄、CSS 和其他，並選擇了“全部”。

另一個潛在問題可能是您的$(window).scroll()函數沒有包含在.ready()函數中（如此處所述）：

$(document).ready(function() {
    $(window).scroll(function() {
        ...
    });
});

將您的代碼粘貼到 JSFiddle 並提供一些虛擬內容時，您的代碼運行良好： JSFiddle demo 。

編輯：

問題已編輯。 給出的新代碼拋出兩個錯誤：

未捕獲的 ReferenceError：fitHeight 未定義未捕獲的 TypeError：無法讀取 null 的屬性“addEventListener”

因此，代碼在到達任何console.log調用之前停止執行。

解決方案2
 66  2019-03-01 18:25:11

就我而言，所有控制台消息都沒有顯示，因為我在“過濾器”文本框中留下了一個字符串。

通過單擊 X 刪除過濾器，如圖所示：

在此處輸入圖片說明

解決方案3
 11 已采納  2013-10-29 16:51:52

我覺得這有點愚蠢，但讓這成為每個人的一課......確保你的目標是正確的選擇器！

基本上控制台沒有記錄任何內容，因為這個特定的代碼片段試圖抓取我窗口的滾動區域，而實際上我的代碼設置不同以滾動整個 DIV。 一旦我改變：

$(window).scroll(function() {

對此：

$('#scroller').scroll(function() {

控制台開始記錄正確的消息。

解決方案4
 8  2020-08-30 04:45:00

單擊恢復按鈕。 console.log將開始工作。

在此處輸入圖片說明

解決方案5
 2  2018-01-23 16:39:27

就我而言，我正在開發一個 Polymer WebComponent，它使用<link rel="import">包含在主 HTML 文檔中。 事實證明 WebComponent HTML 文件由於某種原因被緩存，即使我從緩存版本開始更改了它。

為了解決這個問題，我打開了開發者控制台（在 Chrome 中），右鍵單擊 URL 欄旁邊的重新加載箭頭並選擇“清空緩存和硬重新加載” - 問題解決了。

解決方案6
 2  2020-10-25 21:59:30

這是因為我之前關閉了框列表中的“日志”。 在此處輸入圖片說明

解決方案7
 1  2020-06-26 07:17:16

我只是遇到了同樣的問題，沒有顯示任何控制台消息。 這僅僅是因為我在 Windows 10 上使用了新的 Edge（基於 Chromium）瀏覽器。它不會顯示我的控制台消息，而 Chrome 會顯示。 我猜這是 Edge 的問題，因為 Edge 有另一個奇怪的問題，因為它以不同的方式處理帶有單引號和雙引號的字符串。

解決方案8
 1  2021-11-13 10:14:16

2021 年 11 月的另一個解決方案

某處 console.log 已在某處的 js 文件中被覆蓋（我無法找到）。

但我可以通過放置來測試

控制台中的 console.log 我只得到（空函數）：f{}

我將此添加到我自己的 js 文件的頂部以更正它（絕對黑客，但對我有用）：

`var console = window.console;`

解決方案9
 0  2013-10-29 15:26:14

考慮一種更務實的方法來解決“正確做事”的問題。

console.log("about to bind scroll fx");

$(window).scroll(function() {

       console.log("scroll bound, loop through div's");

       $('div').each(function(){

如果這兩個log都正確輸出，那么問題很可能存在於您的 var 聲明中。 要調試它，請考慮將其分成幾行：

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());

通過這樣做，至少在調試期間，您可能會發現 var id未定義，從而導致整個代碼的其余部分出錯。 您的某些div標簽可能沒有 id 嗎？

解決方案10
 0  2019-04-04 11:04:49

您可能在控制台中使用了過濾器功能，它會隱藏與您的查詢不匹配的任何內容。 刪除查詢，您的消息將顯示。

解決方案11
 0  2019-10-04 17:17:51

只是您需要選擇正確的選項來顯示控制台選項卡下左側提供的選項中的日志消息。 您可以參考屏幕截圖。 截屏

解決方案12
 0  2020-05-05 23:10:29

作為 JavaScript 的新手，我在這里遇到了同樣的問題。 我犯的錯誤是我使用了：

<script type="text.javascript">
  console.log("bla bla bla");
</script>

代替：

<script>
  console.log("bla bla bla");
</script>

使用

類型="text.javascript"

結果沒有在控制台中生成日志。

解決方案13
 0  2020-09-12 16:52:36

在我的情況下，它是由console.groupCollapsed()引起的。

並且ctrl+f顯然不會檢測到折疊的消息。

維護不熟悉的代碼有時很可怕......

它甚至折疊了異常消息，缺少它使我將那些console.log放在首位 ^_^

解決方案14
 0  2021-05-01 00:06:16

如果在 html 中的 console.log 中使用 $ 參數，則單引號 (') 和雙引號 ("") 將不起作用。

使用像 (` `) 這樣的引號

例如：console.log(`${address}`);

這將有助於使用$參數以及在 console.log 中遇到問題的任何人。

解決方案15
 0  2021-11-02 17:59:43

2021年解決方案

  • 開放開發者工具
  • 導航到“控制台”
  • 很可能沒有勾選“詳細”，所以激活它

在此處輸入圖片說明

解決方案16
 -2  2019-02-10 17:25:30

一堆代碼無法正常工作，我試圖確定問題出在哪里，但是console.log()沒有在Chrome Dev工具中記錄任何結果，我是否正確執行了？

$(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');
            }   });
        });

編輯完整代碼

$(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);

編輯

完整代碼的某些部分（上面）引用了其他JS文件，並且在存在這些文件的情況下運行時，代碼不返回錯誤。 故障排除后，我在滾動功能之前看到控制台消息，但是在滾動功能中看不到控制台消息。

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(){

暫無
暫無

聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

相關問題 console.log（）無法按預期工作 Console.log 在 Chrome 中不起作用 Cordova console.log 不工作 如何console.log所有繼承的屬性？ AJAX和React：Console.log無法正常工作嗎？ jQuery console.log和名稱附加不起作用 Javascript console.log使用變量 phonegap --autoreload和console.log無法正常工作 Firefox 插件 console.log() 不工作 console.log在React和graphql中不起作用
相關標簽
 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM