JQuery AJAX加載使用AJAX的表格

所以我有一個按鈕，它將根據ID調用AJAX函數。在這裏它從PHP文件中提取信息（一個html表單）。這幾乎是一個簡單的形式。它完美地加載。我在這個表單中也有一個函數，它也被加載到主html文件中。出於測試目的，我只是希望它可以防止提交併在表單下面附加測試短語。不幸的是，這不起作用。我試圖將表單strait放入html文件中，而不通過AJAX加載，並且工作正常，表單不提交併輸出消息。JQuery AJAX加載使用AJAX的表格

這是我當按鈕被點擊，它的告知形式加入到一個div代碼：

$("#zip-search-button").click(function(e){ 
      e.preventDefault(); 

      if ($("#thezip").val() != "") { 
       $.post("http://website.com/app/deal.php", {zip : $("#thezip").val(), radius : $("#radius").val()}, function(data){ 
        if (data.length > 0) { 
         // Here we add the form 
         $("#results").html(data); 
        } 
       }); 
      } 
     });

這是我當表單提交代碼：

$("#buy-now1").click(function(e){ 
       e.preventDefault(); 

       $("#results").append("Hiiiiiii, This is a test!"); 
      });

任何想法爲什麼表單函數在通過AJAX加載表單時不起作用？

此javascript的所有內容都位於主html文件中body標籤的底部。

來源

2013-10-25 Amie Crutchley

你通過AJAX加載的形式？或者表單是PHP/HTML頁面的一部分？ –

$("#zip-search-button").click(function(e){ 
    e.preventDefault(); 
    if ($("#thezip").val() != "") { 
     $.post("http://website.com/app/deal.php", {zip : $("#thezip").val(), radius : $("#radius").val()}, function(data){ 
      if (data.length > 0) { 
       $("#results").html(data); 
       $("#buy-now1").click(function(e){ 
        e.preventDefault(); 
        $("#results").append("Hiiiiiii, This is a test!"); 
       }); 
      } 
     }); 
    } 
});

來源

2013-10-25 02:05:39

This Works！謝謝！ –

爲什麼不把你的提交按鈕變成一個按鈕？沒有更多的問題與您的表單提交。

<button type="button" onclick="yourfunction();">Click Me</button>

來源

2013-10-25 01:53:33 Machavity

原因有輸入值，我需要;） –

Check out .on in the jquery docs.基本上，因爲加載頁面時窗體並不存在，你的事件處理程序沒有連接。使用.on將偵聽器附加到將在文檔加載時存在的父元素，您將成爲黃金。

來源

2013-10-25 01:56:48

有道理，但我真的不知道如何得到這個工作：/ –

綁定您的活動時，該文件已準備就緒：

$(document).ready(function(){ 
     $("#buy-now1").click(function(e){ 

       e.preventDefault(); 
       $("#results").append("Hiiiiiii, This is a test!"); 
     }); 
});

來源

2013-10-25 02:05:35

如果我沒有錯誤基於艾米的描述，buy-now1按鈕是一部分表單來自Ajax調用。這將不起作用，因爲文檔已準備就緒，但該按鈕不在頁面上。當它加載完成後，點擊事件將不會被附加。 – 2013-10-25 13:17:13

JQuery AJAX加載使用AJAX的表格

回答

相關問題