jQuery：事件監聽器沒有被觸發

我想添加一個事件監聽器使用JQuery的HTML元素。jQuery：事件監聽器沒有被觸發

的test.html

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.3/jquery.min.js"></script> 
<script src="test.js"></script> 

    <body> 
     <select id="options" >                             
     <option value="volvo">Volvo</option>                         
     <option value="saab">Saab</option> 
     <option value="mercedes">Mercedes</option> 
     <option value="audi">Audi</option> 
     </select> 
    </body>

test.js

alert("outside function"); 
$('#options').change(function() { 

    alert("inside function"); 
    var x = $('#options option:selected').text(); 
    alert(x); 
});

現在，當我打開file:///home/ronnie/check/popup.html，如果我選擇的任一選項我jQuery的功能不會被觸發，我剛剛彈出outside function。

我在jsfiddle中試過相同的代碼，它工作得很好http://jsfiddle.net/Vj9LK/。

所以，我的問題是爲什麼它不在鉻中工作。

來源

2012-12-29 ronnie

它工作正常，在我的鉻 –

您正在選擇$("#options")的test.js，在構建<body>之前，它在<script>標記中定義。 jQuery有一個功能，等到一切都構成，這樣您就可以選擇元素：

$(document).ready(function() { 
    // contents of test.js 
});

來源

2012-12-29 11:15:08 pimvdb

總是寫這可能是原因（所以你的答案是一個解決方案）。實際上，jQuery有一個你寫的快捷方式：'$（function（）{...}）;'而不是'$（document）.ready（function（）{...}）;'。 – Tadeck

謝謝。它按要求工作。 – ronnie

你把變函數文檔中（準備好）？

試試這個

alert("outside function"); 

$(document).ready(function(){ 
    $('#options').change(function() { 
     alert("inside function"); 
     var x = $('#options option:selected').text(); 
     alert(x); 
    }); 
});

來源

2012-12-29 11:15:13 MattG

這已經回答 –

@roXon：MattG在第一人稱5秒後回答了問題，我想你的評論在這裏毫無意義。 – Tadeck

的DOM還沒有加載。您需要使用.ready功能 - http://api.jquery.com/ready/

alert("outside function"); 
$(function(){ 
    $('#options').change(function() { 

    alert("inside function"); 
    var x = $('#options option:selected').text(); 
    alert(x); 
    }); 
});

來源

2012-12-29 11:15:29

這已經回答了。 –

@roXon：看看時間戳。 – Tadeck

我懷疑原因可能是這樣的：

當您在HTML文件中做<script src="test.js"></script>，你還沒有定義options選擇標籤還沒有，因此平變化功能沒有正確註冊。因此，在定義select標記後嘗試。

或選擇$(document).ready(function(){})它可以給你想要的結果。

來源

2012-12-29 11:15:33 LPD

是的。我編輯了答案的那一部分。謝謝 – LPD

把你的代碼在$（文件）。就緒（）

$(document).ready(function(){ 
    alert("outside function"); 
    $('#options').change(function() { 

     alert("inside function"); 
     var x = $('#options option:selected').text(); 
     alert(x); 
    }); 
})

來源

2012-12-29 11:15:49

這已經回答 –

對不起，直到我輸入其他人發佈的答案，我沒有得到任何更新。 –

@AmitKhanna：因爲它發生得非常快。僅僅因爲他/她在第一個回答問題之後幾秒鐘就不能判斷回答問題的人。 – Tadeck

使用此代碼其工作，確保後

<html> 
    <head> 
     <script src="http://code.jquery.com/jquery-latest.js"></script> 
    </head> 
    <body> 

    <select id="options" >                             
      <option value="volvo">Volvo</option>                         
      <option value="saab">Saab</option> 
      <option value="mercedes">Mercedes</option> 
      <option value="audi">Audi</option> 
      </select> 
    <script> 
     $('#options').change(function() { 

     alert("inside function"); 
     var x = $('#options option:selected').text(); 
     alert(x); 
    }); 
    </script> 
    </body> 
    </html>

來源

2012-12-29 12:06:15

jQuery：事件監聽器沒有被觸發

回答

相關問題