當div裏面的jquery窗體不工作

我有一個簡單的表單發送數據到一個php文件，這個文件用表單的數據更新數據庫。表單在加載到頁面時單擊href鏈接時正確工作，但當在div中加載jquery load（）時（此頁面被嵌入另一頁中的div中加載）時，表單不會再發送數據，刷新文本輸入或保持焦點。我已經嘗試過「提交」，「直播」和「現場直播」，並且在該div內部似乎沒有任何工作。當div裏面的jquery窗體不工作

<head> 
<script type="text/javascript" src="jquery.js"></script> 
<script type="text/javascript"> 
$(document).ready(function() { 

$('.linkpage').live('click', function(e) {   
    var url = $(this).attr('href'); 
    $('#main').load(url); 
    e.preventDefault(); 
}); 

$("form#DataToDB").livequery(function() { 
var User = $('#User').attr('value'); 
var Message = $('#Message').attr('value'); 
     $.ajax({ 
     type: "POST", 
     url: "updateDB.php", 
     data: "User="+ escape(User) +"& Message="+ escape(Message), 
     dataType: "html", 
     scriptCharset: "utf-8", 
     success: function() { 
     alert("Message sent"); 
     } 
     }); 
$("#Message").attr("value", ""); 
$('input#Message').focus(); 
return false; 
}); 

}); 
</script> 
</head> 

<body> 

<div id="menu"> 
<a href="Page1.php" class="linkpage">Page1</a> 
<a href="Page2.php" class="linkpage">Page2</a> 
</div> 

<div id="main"> 
</div> 

</body>

這是網頁包含表單，嵌套在「主」分區上頁（或page1.php中使page2.php）：

<form id="DataToDB" name="DataToDB"> 
<input type="hidden" name="User" id="User"> 
<input type="text" name="Message" id="Message"> 
<input type="submit" name="Send" value="Send"> 
</form>

我能問哪裏出錯在jQuery腳本？

在此先感謝

來源

2011-12-03 SophieV

你的意思是忽略結束標籤''？ – Sparky

不，這是一個錯字，我糾正了它。謝謝你的重視。 – SophieV

試試這個代碼：

<head> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"    type="text/javascript" ></script> 
<script type="text/javascript"> 
$(document).ready(function() { 

$("#DataToDB").submit(function() { 
var User = $('#User').attr('value'); 
var Message = $('#Message').attr('value'); 
    $.ajax({ 
    type: "POST", 
    url: "updateDB.php", 
    data: "User="+ escape(User) +"& Message="+ escape(Message), 
    dataType: "html", 
    scriptCharset: "utf-8", 
    success: function() { 
    alert("Message sent"); 
    } 
    }); 
$("#Message").attr("value", ""); 
$('input#Message').focus(); 
return false; 
}); 

}); 
</script> 
</head> 

<body> 

<div id="menu"> 
<a href="Page1.php" class="linkpage">Page1</a> 
<a href="Page2.php" class="linkpage">Page2</a> 
</div> 

<div id="main"> 
<form id="DataToDB" name="DataToDB"> 
    <input type="hidden" name="User" id="User"> 
    <input type="text" name="Message" id="Message"> 
    <input type="submit" name="Send" value="Send"> 
</form>   
</div> 

</body>

唉唉......簡單。在你的Page1.php中插入這個頁面2.php

<form id="DataToDB" name="DataToDB"> 
<input type="hidden" name="User" id="User"> 
<input type="text" name="Message" id="Message"> 
<input type="submit" name="Send" value="Send"> 
</form> 

<script type="text/javascript"> 

$("#DataToDB").submit(function() {       
var User = $('#User').attr('value'); 
var Message = $('#Message').attr('value'); 

$.ajax({ 
    type: "POST", 
    url: "updateDB.php", 
    data: "User="+ escape(User) +"& Message="+ escape(Message), 
    dataType: "html", 
    scriptCharset: "utf-8", 
    success: function() { 
    alert("Message sent"); 
    } 
    }); 
$("#Message").attr("value", ""); 
$('input#Message').focus(); 
return false; 
}); 

</script>

來源

2011-12-03 16:25:49

代碼有效，但我需要將主div中的內容加載到該div內的另一個頁面上。 Page1.php和Page2.php將包含表單。我更新了代碼，以便我清楚我需要做什麼。 – SophieV

感謝您的建議，現在它工作正常。 – SophieV

首先，您有一個未關閉的窗體。將</form>放在表單末尾DataToDB。

<form id="DataToDB" name="DataToDB"> 
<input type="hidden" name="User" id="User"> 
<input type="text" name="Message" id="Message"> 
<input type="submit" name="Send" value="Send"> 
</form>

其次，儘量使用.submit功能：

$("#DataToDB").submit(function() {

當你點擊提交按鈕，你會看到警報。

來源

2011-12-03 15:53:42

我已經嘗試使用.submit;它在div外部時可以很好地工作，但當div在div內時已經在jquery load（）中被加載到div中時不會再出現。 – SophieV

原來有一個不相關的HTML「錯誤」導致表單不能在Ie中提交。修復後，最初的代碼和建議都可以工作。

來源

2012-10-10 19:06:00 dux0r

當div裏面的jquery窗體不工作

回答

相關問題