在句柄上處理jQuery onClick事件

我想設置一個簡單的jQuery onClick事件來使UI在句柄模板上動態化。我想知道在特定的點擊後添加Class（）。在句柄上處理jQuery onClick事件

考慮HTML（由車把生成）

{{#if hasButton}} 
     <div id="container">  
      <button type="submit" class="myButton">Click me!</button> 
     </div> 
    {{/if}}

即：一按鈕中點擊後，其容器將會收到一個加載的類，將使用CSS創建的互動。

$(".myButton").on("click", function(event){ 
     $(this).parent().addClass("loading"); 
});

此代碼應繼續我的車把模板或者我應該改寫成它的特殊幫助？是否有任何可以提供的例子，以便我可以研究它，然後開發類似的東西？

在此先感謝！

來源

2013-07-09 Hal

你應該保持'html'，'css'和'js'分離。如果您從模板創建某些內容，則應該知道應在模板中執行哪些操作。（或者是因爲您使用服務器中的模板發送此信息），或者是因爲您已經知道您的代碼。因此，無論註冊'callbacks'爲您的活動你附加的模板後，還是會使用[代表]（http://api.jquery.com/on/#direct-and-delegated-events）事件（類似： '$（containerWhereYouAddThetemplateTo）。在（「點擊」，「.myButton」，函數（）{}）'; –

你必須刷新你的Jquery聽衆插入節點到你的HTML DOM後。

var source = "<li><a href="{{uri}}">{{label}}</a></li>"; 
var template = Handlebars.compile(source); 
var context = {"uri":"http://example.com", "label":"my label"}; 
$("ul").append(template(context)); 

// add your JQuery event listeners 
$("li").click(function(){ alert("success"); });

來源

2013-09-29 13:05:45

我不確定你的問題到底是什麼。如果您在本例中使用父代（）代替prev()，將JavaScript保存在* .js文件中，則代碼爲perhaps。

來源

2013-07-09 13:29:53 glautrou

的問題是，該事件不會被觸發，因爲補充說jQuery的根本就沒有作品（這段代碼實際上變在車把模板不是外部JS）父（順便說一句，我從上一個（改變）（）爲更好的代碼的可讀性） – Hal

沒有必要重新將事件處理程序上的每一個動態DOM更新，如果你在文件級別定義它們：

$(document).on('click','li',function(){ 
    alert('success'); 
});

希望這有助於！ :-)

來源

2014-02-15 07:21:47 murnax

這是它是如何在現代web應用程序做！ – ProblemsOfSumit

話語。這樣來做，但我喜歡通過用'document'代替最接近的可渲染節點，儘可能縮小範圍，就像您在其中渲染車把模板的div一樣。 –

在句柄上處理jQuery onClick事件

回答

相關問題