元素上的Jquery綁定事件失敗

我們正在使用Jquery 2.1.4並寫出了自己的JavaScript類，應該照顧事件。這是一個非常簡單的「應用程序」。它所做的只是照顧提交表格。在此之前，它處理數據。元素上的Jquery綁定事件失敗

我們，我們呼籲渲染頁面初始方法：

OWebForm.prototype.init = function(){ 
    console.log("init Method called"); 

    ... 
    $("#submit_message").on("click", this._submit); 
    console.log($("#submit_message")); 
    ... 
} 
OWebForm.prototype._submit = function(e){ 
    e.preventDefault(); 
    console.log("_submit Method called"); 
... 
    }

一旦按鈕「#submit_message」被點擊時，它應該叫OWebForm類的_submit方法。當查看控制檯中的元素時，我可以看到它在頁面加載時不受任何約束。因此，一旦按鈕被點擊，代碼就不會被執行。

在HTML我有以下代碼

：

<script type="text/Javascript"> 
     var _oWebForm = new OWebForm("0bcfwqx23xv02dfaqfujdqyafziic4b07uxkkg1y6lkof7x0px0vjm2tpaik2l2rmlrhnjya0bvctnpq26dqcom1ij5zpibodke3rs1z4f2syllthtj0kpl3p4vrw0vw");  
     _oWebForm.init(); 
    </script>

從我理解的文檔，該函數具有之前它被綁定到一個元素事件存在。處理對象時不是這種情況嗎？我將如何解決這個問題？

來源

2016-01-07 Richard

如何使用'OWebForm.prototype.init'？ – Satpal

@Satpal我已經調整了問題幷包含了一段代碼，我在HTML中使用它來構建並調用OWebForm類 – Richard

您是否嘗試過使用文檔就緒的處理程序？ '$（function（）{// Your code}）;' – Satpal

你的腳本是在DOM被加載之前執行的，所以元素還沒有存在，並且jQuery選擇器不匹配任何東西，所以沒有元素獲得綁定到它們的點擊處理程序。您需要撥打init()方法與$(document).ready()。

在文檔「準備就緒」之前，不能安全地操作頁面。 jQuery爲您檢測到這種狀態。包含在$（document）.ready（）中的代碼只有在頁面文檔對象模型（DOM）準備好執行JavaScript代碼時纔會運行。

$(document).ready(function() { 
    var _oWebForm = new OWebForm("0bcfwqx23xv02dfaqfujdqyafziic4b07uxkkg1y6lkof7x0px0vjm2tpaik2l2rmlrhnjya0bvctnpq26dqcom1ij5zpibodke3rs1z4f2syllthtj0kpl3p4vrw0vw"); 
    _oWebForm.init(); 
});

來源

2016-01-07 14:19:12 Satpal

這個工作對我來說：

var OWebForm = function(a){ 
 

 
}; 
 
OWebForm.prototype.init = function() { 
 
    alert("init Method called"); 
 

 
    $("#submit_message").on("click", this._submit); 
 
} 
 
OWebForm.prototype._submit = function(e){ 
 
    e.preventDefault(); 
 
    alert("_submit Method called"); 
 
} 
 
$(function() { 
 
    var _oWebForm = new OWebForm("0bcfwqx23xv02dfaqfujdqyafziic4b07uxkkg1y6lkof7x0px0vjm2tpaik2l2rmlrhnjya0bvctnpq26dqcom1ij5zpibodke3rs1z4f2syllthtj0kpl3p4vrw0vw"); 
 
    _oWebForm.init(); 
 
});

<script src="http://code.jquery.com/jquery-1.11.3.js"></script> 
 

 
<form id="myFrm"> 
 
    <input type="text"> 
 
    <input id="submit_message" type="submit" value="Click me To test"> 
 
</form>

您需要將其替換：

 
$("#submit_message").on("click", this._submit);

有：

 
$(document).on("click", "#submit_message", this._submit);

如果submit_message尚未加載！

來源

2016-01-07 14:16:13 gaetanoM

元素上的Jquery綁定事件失敗

回答

相關問題