淘汰賽（模板綁定）：JavaScript（JQuery）功能不會從模板內部調用

我有一個主頁面，我有所有的腳本引用，並在體內我有一個duv容器，它有模板數據綁定和我的HTM正在被綁在那裏。淘汰賽（模板綁定）：JavaScript（JQuery）功能不會從模板內部調用

問題是由Jquery控制的我的功能無法正常工作。例如日期選擇器工作時，我把它放在引用JavaScript的主頁面，但不能在我的htm中綁定到模板。

所有的庫都得到正確加載，但我的jQuery功能無法正常工作時，它的模板內部調用。

例如主頁：

<script src="Scripts/jquery.js" type="text/javascript"></script> 
<script src="Scripts/jquery.qtip.js"></script> 
<script src="Scripts/foundation.min.js"></script> 
<script src="Scripts/jquery.tablesorter.js"></script> 
<script src="Scripts/jquery-ui.js"></script> 
<script src="Scripts/languageswitcher.js"></script> 

<div id="Container" ua-app-id="topVm" data-bind='template: {name: pageModel, data: pageVM }'>     
</div> 
<!-- Initialize JS Plugins --> 
<script src="Scripts/app.js"></script>

現在我的觀點得到加載在運行時的主要頁面。在我看來，我有一個日期選擇器，它不起作用。當我把它放在主頁面，它工作正常。

來源

2013-01-22 Aditya

我認爲這是因爲你的jQuery代碼在你的模板呈現之前運行。您可以使用模板綁定中提供的afterRender回調來啓用datepicker。請參閱documentation瞭解更多信息和示例。

但是，一個更好的方法來完成這一點，是創建一個自定義綁定。事情是這樣的：

ko.bindingHandlers.datepicker = { 
    init: function(element){ 
     $(element).datepicker(); 
    }, 
    update: function(element) { 
     $(element).datepicker('refresh'); 
    } 
};

然後你就可以使文本輸入到一個datepicker通過這樣做：

<input type="text" data-bind="datepicker:true" />

瞭解更多關於自定義綁定here

來源

2013-01-22 22:35:09 aaberg

可以參考我的整個定製JavaScript庫捆綁。例如，在init函數（）中，我可以調用完整的庫。或者，如果我可以在我的主模板上做一個事件綁定？我在問這是因爲我的函數是跨庫傳播的，並且調用一切在自定義綁定中沒有任何意義。因此，一旦模板被加載，如果我可以重新調用這些庫，它會是一種處理事物的好方法嗎？ – Aditya

對不起，但我不明白你的問題！你能給個例子嗎？ – aaberg

問題來自我的頁面，它使用的是knockout，它沒有從jquery.qtip.js中識別qtip的方法。實際的問題是它在foundation.min.js之前加載。我改變了順序，它開始正常工作。你的日期選擇器解決方案工作，謝謝你。剛開始學習淘汰賽，所以我的問題可能聽起來很愚蠢。 – Aditya

淘汰賽（模板綁定）：JavaScript（JQuery）功能不會從模板內部調用

回答

相關問題