jquery表单插件不起作用

时间:2013-03-24 06:20:39

标签: ajax jquery jquery-plugins jquery-forms-plugin

我是一个新手程序员。我用一个简单的代码卡住了两天。我尝试使用jquery表单插件将表单提交到另一个页面并从该页面获得反馈。问题是该插件无效。表格以正常方式提交,没有反馈。这是代码

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.js"></script> 
<script src="http://malsup.github.com/jquery.form.js"></script>

<div id='preview'></div>
<form  action='ajaxcall.php' id='upload_pic' enctype='multipart/form-data' method='post'>
<input type='file' id='pic' name='picture'>
<input type='submit' id='sub'>
</form>

var options=
{
target:'#preview',
url:'ajaxcall.php'


};

$(document).ready(function(){
$("#sub").click(function(){
    $('#preview').html("<img src='images/loader.gif' alt='Loading.....'/>");
    $('#upload_pic').ajaxForm(options).submit();
    });
});

这是我的ajaxcall.php页面代码

 if(!empty($_FILES['picture']['size']))
 {
echo "<img src='images/197.jpg'>";

 }

期望是回显的图像会反馈,但页面只是重定向到ajaxcall.php页面.ajaxForm()函数不起作用。但为什么?请帮忙。谢谢。

2 个答案:

答案 0 :(得分:0)

只需将您的提交按钮替换为普通按钮,因为您已经从您的点击处理程序以编程方式提交表单,因此请替换以下html:

<input type='submit' id='sub'>

这个:

<input type='button' id='sub'>

答案 1 :(得分:0)

使用这些代码而不是脚本代码。抱歉迟到了

$(document).ready(function(){
$("#sub").click(function(){
       var options=
       {
          target:'#preview',
          url:'ajaxcall.php' 
       };
       $('#preview').html("<img src='images/loader.gif' alt='Loading.....'/>");
       $('#upload_pic').ajaxForm(options).submit();

    });
});