2014-12-03 248 views
-1

我想用一個按鈕來創建一個表單,要求用戶輸入並將其發送到php文件而無需刷新,但是在我將表單附加到html文件並試圖提交它之後,java函數沒有跑。jQuery追加表格

,我用於追加形式的函數:

function reporterror(){ 
if (document.getElementById("report")){ 
    console.log("Still have report"); 
}else{ 
    $("<form id='report' action='report.php' method='post'><div ><h2 style='text-align:center;'>Report Error</h2><h3>Description:</h3><textarea rows='10' cols='60' name='report' id='description' placeholder='No more than 500 words' style='border-radius:10px;border:1px solid #000;'></textarea><input type='submit' style='border-radius:5px;'></input><input type='button' onclick='reportclose()' value='Close' style='border-radius:5px;'></input></div></form>").appendTo("#content"); 
} 

};

是didnt運行的函數:

$(document).ready(function() { 
$("#report").on("submit",function(event){ 
    event.preventDefault(); 
    if (document.getElementById("description").value==""){ 
     $(".warning").remove(); 
     $("#description").after("<p class='warning' style='color:red'>Description is required</p>"); 
     console.log("yes"); 
    }else{ 

     $.ajax({ 
       type:"POST", 
       url:"report.php", 
       data:$("#report").serialize(), 
       success:function(){ 
        console.log("Great"); 
        document.getElementById("report").innerHTML="<h2>Thank You for helping us to improve!</h2><br><p>Your message have been successfully sented to this awesome website!</p><input type='button' onclick='reportclose()' value='Close' style='border-radius:5px;'></input>"; 
       } 
     }) 

    } 
}); 

})

這是它看起來像現在:http://cs20p.site11.com/

+0

我想你需要委託onsubmit事件:http://learn.jquery.com/events/event-delegation/但你怎麼稱'reporterror()'方法? – 2014-12-03 20:54:18

回答

0

嘗試$("#report").on("submit",function(event){

改變這一行$(document).on("submit", ".report", function(event){

和這$("<form id='report'$("<form class='report' id='report'

問題出現,因爲您使用id而不是類。 Id元素可能只有一個

+0

問題出現是因爲您使用了id而不是class。 Id元素可以只有一個 – Oleg 2014-12-03 21:00:04