我是 Wordpress 和 JQuery 的新手,所以让我开始解释我想要做什么。
我有一个管理页面,在这个页面内我让用户能够上传图片。我希望使用 Ajax 完成此操作(独立于一般表单更新)。
这是我到目前为止的代码:
- 在页面顶部 - 脚本包括:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script> <script src="http:// malsup.github.com/jquery.form.js">
我可以确认这些脚本是“可ping 通的”并且可以正常工作。
现在是 HTML 代码:
<table width="100%">
<tr>
<td width="100" style="padding:10px" valign="top">Email Image (180x180):</td>
<td style="padding:10px"><img id="previewEmailImage" width=180 height=180>
</td>
</tr>
<tr>
<td></td>
<td>
<div id='emailpreviewloader'>
</div>
</td>
</tr>
<tr>
<td></td>
<td>
<form id="imageform" method="post" enctype="multipart/form-data" action="/ajaximage.php">
<input type="file" name="photoimg" id="photoimg" />
</form>
</td>
</tr>
</table>
HTML 中的关键内容是 a) 表单和 b) div emailpreviewloader。
现在就在 html 表之后,内联我有以下 js:
<script type="text/javascript">
$(document).ready(function()
{
$('#photoimg').live('change', function()
{
$("#emailpreviewloader").html('');
$("#emailpreviewloader").html('<img width="180" src="/loader.gif" alt="Uploading...."/>');
$("#imageform").ajaxForm(function(result)
{
alert("Thank you for your comment!");
});
});
});
</script>
出于测试目的,ajaximage.php 只包含 1 行:Echo "It working";
所以假设我的工作做得对,并且上面的 html + js 是正确的,看起来 Wordpress 可能会以某种方式劫持 Ajax 并阻止它按预期工作。这可能吗?
我想做的只是有一个常规的 Ajax 帖子,这怎么可能?
编辑:
什么工作:
文件上传控件的更改事件正在触发。我已经通过警报确认了这一点,并且 loader.gif 是可见的。但似乎表单没有触发,或者没有正确触发。内心的警觉,永远不会触发。