所以我一直在阅读WordPress前端的AJAX文件上传教程。目前我什么都没用。对我来说最有意义的是：http://theaveragedev.com/wordpress-files-ajax/
这是我的代码：
在我的模板文件示例中。php
<script>var ajax_url = "<?php echo admin_url(\'admin-ajax.php\'); ?>"</script>
<form id="file_form">
<?php wp_nonce_field(\'ajax_file_nonce\', \'security\'); ?>
<input type="hidden" name="action" value="my_file_upload">
<label for="file_upload">It\'s a file upload...</label>
<input type="file" name="file_upload">
<input type="submit" value="Go">
</form>
这是在ajax文件上传中。js公司
jQuery(document).ready(function(){
var form_data = {};
$(this).find(\'input\').each(function(){
form_data[this.name] = $(this).val();
});
$(\'#file_form\').ajaxForm({
url: ajax_url, // there on the admin side, do-it-yourself on the front-end
data: form_data,
type: \'POST\',
contentType: \'json\',
success: function(response){
alert(response.message);
}
});
});
这是我的职责。php
function q_scripts(){
$src = get_template_directory_uri().\'/js/ajax-file-upload.js\';
wp_enqueue_script(\'my_ajax_file_uploader_thing\', $src, array(\'jquery\', \'jquery-form\'));
}
add_action(\'init\', \'q_scripts\');
function handle_file_upload(){
check_ajax_referer(\'ajax_file_nonce\', \'security\');
if(!(is_array($_POST) && is_array($_FILES) && defined(\'DOING_AJAX\') && DOING_AJAX)){
return;
}
if(!function_exists(\'wp_handle_upload\')){
require_once(ABSPATH . \'wp-admin/includes/file.php\');
}
$upload_overrides = array(\'test_form\' => false);
$response = array();
foreach($_FILES as $file){
$file_info = wp_handle_upload($file, $upload_overrides);
// do something with the file info...
$response[\'message\'] = \'Done!\';
}
echo json_encode($response);
die();
}
add_action(\'wp_ajax_my_file_upload\', \'handle_file_upload\');
我尝试将enctype添加到表单元素中，但没有成功。我不断收到的错误是一个警告，说“未定义”。有人知道我如何纠正这个问题吗？
EDIT
“未定义”问题现在已经消失了，因为我编辑了js文件，使其具有一个click事件，并更改了表单输入循环的选择器：
jQuery(document).ready(function($){
$(\'#file_form :submit\').click(function() {
var form_data = {};
$(\'#file_form\').find(\'input\').each(function () {
form_data[this.name] = $(this).val();
});
console.log(form_data);
$(\'#file_form\').ajaxForm({
url: ajax_url, // there on the admin side, do-it-yourself on the front-end
data: form_data,
type: \'POST\',
contentType: \'json\',
success: function (response) {
alert(response.message);
},
error: function (response) {
console.log(\'error\');
}
});
return false;
});
});
文件仍没有上载到媒体文件夹。我还想得到上传的URL后，它已经上传回来。
我正在向控制台写入file对象，以便查看正在发生的情况。下面是一个例子：
Object {security: "e6db2a6eee", _wp_http_referer: "/chat?sessionappid=138", action: "my_file_upload", file_upload: "C:\\fakepath\\download.jpg", "": "Go"}
这有什么问题吗？这就是为什么它没有上传的原因吗？
SO网友:Adnan Limdiwala
您好，您已经将此代码用于WordPress前端AJAX文件上载教程代码这是我的代码：
在我的模板文件示例中。php
<form enctype="multipart/form-data">
<input type="text" name="support_title" class="support-title">
<input type="file" id="sortpicture" name="upload">
<input class="save-support" name="save_support" type="button" value="Save">
</form>
这是在ajax文件上传中。js公司
jQuery(document).on(\'click\', \'.save-support\', function (e) {
var supporttitle = jQuery(\'.support-title\').val();
var querytype = jQuery(\'.support-query\').val();
var file_data = jQuery(\'#sortpicture\').prop(\'files\')[0];
var form_data = new FormData();
if (supporttitle == \'\') {
jQuery(\'.support-title\').css({"border": "1px solid red"})
return false;
} else {
jQuery(\'.support-title\').css({"border": "1px solid #e3ecf0"})
}
form_data.append(\'file\', file_data);
form_data.append(\'action\', \'md_support_save\');
form_data.append(\'supporttitle\', supporttitle);
jQuery.ajax({
url: \'<?php echo admin_url(\'admin-ajax.php\'); ?>\',
type: \'post\',
contentType: false,
processData: false,
data: form_data,
success: function (response) {
jQuery(\'.Success-div\').html("Form Submit Successfully")
},
error: function (response) {
console.log(\'error\');
}
});
});
});
这是函数。PHP代码
add_action( \'wp_ajax_md_support_save\',\'md_support_save\' );
add_action( \'wp_ajax_nopriv_md_support_save\',\'md_support_save\' );
function md_support_save(){
$support_title = !empty($_POST[\'supporttitle\']) ?
$_POST[\'supporttitle\'] : \'Support Title\';
if (!function_exists(\'wp_handle_upload\')) {
require_once(ABSPATH . \'wp-admin/includes/file.php\');
}
// echo $_FILES["upload"]["name"];
$uploadedfile = $_FILES[\'file\'];
$upload_overrides = array(\'test_form\' => false);
$movefile = wp_handle_upload($uploadedfile, $upload_overrides);
// echo $movefile[\'url\'];
if ($movefile && !isset($movefile[\'error\'])) {
echo "File Upload Successfully";
} else {
/**
* Error generated by _wp_handle_upload()
* @see _wp_handle_upload() in wp-admin/includes/file.php
*/
echo $movefile[\'error\'];
}
die();
}
