Question

我有一个将数据发送到php文件的简单表单，此文件使用表单数据更新数据库。在单击href链接的页面中加载时表单正常工作，但是当在div中加载jquery load（）时（此页面加载在嵌套在另一页面中的div中），表单不再发送数据，刷新文本输入或保持焦点。我尝试过“提交”，“直播”和“活动查询”，但在内部div中似乎没有任何效果。

<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），嵌套在上一页的“main”div中：

<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脚本中的错误在哪里吗？

提前致谢

Answer 1

首先，你有一个未公开的表格。将</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() {

当您点击“提交”按钮时，您将看到警报。

Answer 2

试试这段代码：

<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 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>

<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>

Answer 3

原来有一个不相关的HTML“错误”导致表单无法在I.e.中提交。修好之后，初始代码和建议都有效。

在div内部时，Jquery表单不起作用

3 个答案: