私は 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 行のみが含まれています。
したがって、私が自分の仕事を正しく行い、上記の html + js が正しいと仮定すると、Wordpress が何らかの方法で Ajax をハイジャックし、期待どおりに機能しないように思われます。これは可能ですか?
私がやりたいことは、定期的に Ajax の投稿をすることだけですが、これはどのように可能ですか?
編集:
何が機能していますか:
ファイル アップロード コントロールの変更イベントが発生しています。これをアラートで確認したところ、loader.gif が表示されています。しかし、フォームが起動していないか、正しく起動していないように見えます。内部アラートは決して発火しません。