JQuery在粘貼到控制檯時起作用，但在頁面加載時不起作用

爲什麼在頁面加載時不起作用，但是當我將jquery粘貼到控制檯中時，它可以工作。JQuery在粘貼到控制檯時起作用，但在頁面加載時不起作用

<!doctype html> 
<html lang="en"> 
    <head> 
    <meta charset="utf-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <title>Alex Cory</title> 
    <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/latest/css/bootstrap.min.css"> 
    </head> 
    <body id="page-top" data-spy="scroll" data-target=".navbar-custom"> 
    <div id="root"></div> 
    <script src="src/app.js"></script> 
    <script src="//code.jquery.com/jquery-2.2.3.min.js" integrity="sha256-a23g1Nt4dtEYOj7bR+vTu7+T8VP13humZFBJNIYoEJo=" crossorigin="anonymous"></script> 
    <script src="//cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js"></script> 
    <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script> 
    <script> 
     $(document).ready(function(){ 
     $('.page-scroll a').bind('click', function(event) { 
      console.log('CLICKED BUTTON! ^_^'); 
      event.preventDefault(); 
     }); 
     }); 
    </script> 
    </body> 
</html>

來源

2016-04-29 Alex Cory

哪裏有問題'$（「頁面滾動一個」）的元素' –

通過您的網頁似乎怎麼看即將成立，我懷疑你注入你的內容到頁面從：

<script src="src/app.js"></script>

，因爲有一個在代碼本身沒有實際內容。

如果是這種情況，這是因爲當頁面加載和$(document).ready()火災，$('.page-scroll a')回報null因爲它沒有被渲染到DOM的是，簡單地說。

要解決此問題，您需要將事件處理程序附加到要在加載時將呈現到頁面中的元素。該body標籤是一個不錯的這個例子中，我們要聽.page-scroll a使用jQuery's on方法點擊：

// We attach a click event listener to the body element 
// and we try to track when .page-scroll a is clicked 
$('body').on('click', '.page-scroll a' function(event) { 
    console.log('CLICKED BUTTON! ^_^'); 
    event.preventDefault(); 
});

這工作，因爲由於事件處理程序貼在身上，每次的東西被點擊了網頁，它會檢查是否點擊了.page-scroll a，而不是在嘗試將事件處理程序附加到尚不存在的元素之前。

來源

2016-04-29 20:05:10

您的定位點必須在DOM準備就緒後創建。所以，你應該綁定點擊父元素，例如：

$('body').on('click', '.page-scroll a', function(e) {....});

這樣一來，無論何時創建錨，只要一個點擊的身體和目標是.page-scroll a的功能將被執行。

來源

2016-04-29 20:05:48 skobaljic

問題是因爲你想在DOM尚未準備好時調用一個函數。

插入到body標籤

//link to the script file here 
<body   onload="enterHereYourFunctionYouWantToLoad() " >

這將加載功能和加載頁面時特殊功能時就會運行。

來源

2016-04-29 20:06:32

從jQuery文檔

在jQuery 1.7中，。對（）方法是用於事件處理程序安裝到一個文件的優選方法。對於早期版本，.bind（）方法用於將事件處理程序直接附加到元素。處理程序被附加到jQuery對象中當前選定的元素上，所以這些元素必須存在於對.bind（）的調用發生時。要獲得更靈活的事件綁定，請參閱.on（）或.delegate（）中的事件委託討論。

所以你使用JQuery.on()方法

爲什麼你的代碼的控制檯也正是因爲已經有元素系列

來源

2016-04-29 20:12:47 Walter

JQuery在粘貼到控制檯時起作用，但在頁面加載時不起作用

回答

相關問題