jQuery的功能只適用於重載

我已經是從一個單獨的文件加載到一個jQuery Mobile的頁面在多頁的網站下面的非常簡單的代碼片段，我建設：jQuery的功能只適用於重載

$(document).ready(function(){ 
    $('select[name="state_choice"]').change(function(){ 
     var thisState = $(this).val(); 
     var indexState = '#' + thisState; 
     $('.state').hide(); 
      $(indexState).show(); 
     }); 
})

這是工作但現在只有當我重新加載頁面時才起作用。我正在用Firebug檢查頁面加載情況，它並沒有持續加載jQuery文件，因爲這個鏈接直到重新加載才顯示出來。

<script src="inc/jquery/belmont.custom.js"></script>

通常情況下，控制檯將顯示，當一個新的頁面被稱爲在jQuery Mobile的，但我確實發現了這個特定頁面並不總是在控制檯日誌中顯示被點擊一個鏈接時。我已經在桌面模擬器（Dashcode的iOS模擬器），桌面瀏覽器（FF和Safari）和我的iPhone上進行了測試，所有測試結果都相同。

有沒有人見過這種行爲？我如何確保這項工作始終如一？

編輯：我已經改變使用綁定的代碼如下：

$(document).bind('pageinit', function(){ 
    $('select[name="state_choice"]').change(function(){ 
     var thisState = $(this).val(); 
     var indexState = '#' + thisState; 
     $('.state').hide(); 
     $(indexState).show(); 
    }); 
})

我已經加入的console.log（indexState）的功能，這並不一致要麼解僱。

而且我之前實際上曾說過 - 這是一個由單頁組成的移動網站。我是否必須將jQuery自定義函數腳本加載到每個頁面中？或者我可以將它加載到相關問題中？

來源

2012-06-17 Jay Blanchard

我能得到它整理出來。首先，必須在jQuery核心文件之後立即加載自定義js文件。其次，使用$（document）.bind（'pageinit'，function（）{....）比使用ready方法更好。 –

今天上午再次審查之後，似乎問題依然存在。你需要重新加載頁面，其他的工作不在門口。我更新了上面的代碼以反映我所做的更改。 –

下面是我如何整理出來的。由於jQM使用AJAX加載每個後續頁面，因此您需要像處理其他動態加載的元素一樣對待這種交互。更改bind()到on()（我使用jQuery 1.7+）得到的一切工作像它應該：

$('body').on('pageinit', '#id_of_page_using_function', function(){ 
    $('select[name="state_choice"]').change(function(){ 
     var thisState = $(this).val(); 
     var indexState = '#' + thisState; 
     $('.state').hide(); 
     $(indexState).show(); 
    }); 
})

來源

2012-06-18 15:09:06

jQuery的功能只適用於重載

回答

相關問題