使用jQuery表單插件無法正常工作

我一直在試圖弄清楚如何使用這個jQuery表單插件來上傳文件，但它並沒有看到我做它需要做的事情。使用jQuery表單插件無法正常工作

我有jQuery的：

$('.upload-file').click(function() 
{ 
    $('#htmlForm').ajaxForm({ 
     // target identifies the element(s) to update with the server response 
     target: '#htmlExampleTarget', 

     // success identifies the function to invoke when the server response 
     // has been received; here we apply a fade-in effect to the new content 
     success: function(msg) { 
      $('#htmlExampleTarget').hide().html(msg).fadeIn('slow'); 
     } 
    }); 
});

的HTML：

<div id="container"> 
    <form action="upload.php" method="post" id="htmlForm" enctype="multipart/form-data"> 
     <p>E-mail<br /> 
     <input type="text" name="email" id="email" /></p> 
     <p>File<br /> 
     <input type="file" name="upload" id="upload" /></p> 
     <p><input type="button" value="Submit" class="upload-file" /></p> 
    </form> 
</div> 
<div id="htmlExampleTarget"></div>

jQuery的表格插件包含在<script>在<head></head>與$(document).ready(function()每當我點擊按鈕提交形式，它什麼都不做。雖然，如果我將其更改爲

<input type="submit" value="Submit" class="upload-file" />

表單提交，但去upload.php時，我應該指望它輸出的<div id="htmlExampleTarget"></div> HTML和它沒有做到這一點。

編輯：

<script type="text/javascript" src="js/jquery.form.min.js"></script> 
<script type="text/javascript" src="js/jquery.1.4.2.min.js"></script> 
<script type="text/javascript" src="js/jquery.wmk.min.js"></script> 
<script type="text/javascript" src="js/uimg-core.js"></script>

來源

2010-09-30 MacMac

.ajaxForm()是建立一個<form>，沒有提交它，而是要在document.ready運行：

$(function() { 
    $('#htmlForm').ajaxForm({ 
    target: '#htmlExampleTarget', 
    success: function(msg) { 
     $('#htmlExampleTarget').hide().html(msg).fadeIn('slow'); 
    } 
    }); 
});

然後做變化您的類型爲submit按鈕：

<input type="submit" value="Submit" class="upload-file" />

的選擇（雖然這並不正常降級）是調用.ajaxSubmit()這樣的：

$('.upload-file').click(function() { 
    $('#htmlForm').ajaxSubmit({ 
    target: '#htmlExampleTarget', 
    success: function(msg) { 
     $('#htmlExampleTarget').hide().html(msg).fadeIn('slow'); 
    } 
    }); 
});

這實際上提交表單現在，而不是將其設置通過AJAX發送它的submit處理程序。

來源

2010-09-30 17:58:35

HTML是什麼？ – MacMac 2010-09-30 18:03:11

@YouBook - 在第二個例子中，html不會改變，它仍然可以是任何東西......如果它是一個'type =「submit」'按鈕，你需要'event.preventDefault（）'或'return false'。 – 2010-09-30 18:05:30

它一直在煩我，總是去'upload.php' ... – MacMac 2010-09-30 18:08:11

使用jQuery表單插件無法正常工作

回答

相關問題