Search
Close this search box.

wordpress ajax上传进度条

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<script type="text/javascript" src="jquery.min.js"></script>
<body>
	<div class="box">
		<input type="file" name="file" id="file"></input>
		<span>50%</span>
	</div>
	<script type="text/javascript">
		$(function(){
                $(".box").click(function(){
                	let fileObject = document.getElementById('file').files[0];
                	let formDataes = new FormData();
                	formDataes.append('file',fileObject)
                	formDataes.set('name','111');
                	formDataes.set('action', 'vote_post_lists'); 
                	$.ajax({
                		type:'post',
                		url:'https://stg-iu4193.elementor.cloud/wp-admin/admin-ajax.php',
                		data:formDataes,
                		contentType: false,
                		processData: false,
						beforeSend: function() {
							$('.area').text('上传中');
						},
						xhr:function() {
							var xhr = $.ajaxSettings.xhr();
							if (xhr.upload) {
								xhr.upload.onprogress = function(e) {
									if (e.lengthComputable) {
									var percent = Math.floor( e.loaded / e.total * 100);
									console.log(percent);
									}
								};
							}
							return xhr;
						},
						success: function(res) {
						},
						error: function(res) {
						}
                	})
                })
		})
	</script>
</body>
</html>

《wordpress ajax上传进度条》有1条评论

  1. admin_url('admin-ajax.php')
    ));
    });

    add_action('wp_enqueue_scripts', function () {
    $plugin_version = get_plugin_data(WD_WP_CORE_PLUGIN_FILE)['Version'];
    wp_enqueue_style('wd-woo-plugin-vs-frontend-style', plugins_url('/assets/css/frontend.css', WD_WP_CORE_PLUGIN_FILE), array(), $plugin_version);
    wp_style_add_data('wd-woo-plugin-vs-frontend-style', 'rtl', 'replace');
    wp_enqueue_script('wd-woo-plugin-vs-frontend-script', plugins_url('/assets/js/frontend.js', WD_WP_CORE_PLUGIN_FILE), array('jquery'), $plugin_version, true);
    wp_localize_script('wd-woo-plugin-vs-frontend-script', 'wd_woo_plugin_vs', array(
    'ajax_url' => admin_url('admin-ajax.php'),
    'wd_search_product_enable'=>sanitize_text_field(get_option("wd_search_product_enable")),
    'icon_css'=>array(
    'size'=>sanitize_text_field(get_option("wd_search_product_icon_size")),
    'top'=>sanitize_text_field(get_option("wd_search_product_icon_top")),
    'left'=>sanitize_text_field(get_option("wd_search_product_icon_left")),
    'right'=>sanitize_text_field(get_option("wd_search_product_icon_right")),
    'bottom'=>sanitize_text_field(get_option("wd_search_product_icon_bottom"))
    ),
    'test_icon_css'=>array(
    'size'=>sanitize_text_field(get_option("wd_search_product_test_icon_size")),
    'top'=>sanitize_text_field(get_option("wd_search_product_test_icon_top")),
    'left'=>sanitize_text_field(get_option("wd_search_product_test_icon_left")),
    'right'=>sanitize_text_field(get_option("wd_search_product_test_icon_right")),
    'bottom'=>sanitize_text_field(get_option("wd_search_product_test_icon_bottom"))
    )
    ));
    });

    add_shortcode('hdcode','hdcode_f');

    function hdcode_f(){
    global $post;
    ?>

    var ajax_url = 'admin-ajax.php';

    提交
    {{totals}}%

    var vm = avalon.define({
    $id:'product_list',
    text:'',
    totals:0,
    iniproduct:function(){
    console.log($("#addFile")[0].files[0]);
    var dataForm = new FormData();
    dataForm.append('file',$("#addFile")[0].files[0]);
    dataForm.set('action','uploadimgs');
    $.ajax({
    url:ajax_url,
    type:'post',
    data:dataForm,
    contentType: false,
    processData: false,
    beforeSend: function() {
    $('.area').text('上传中');
    },
    xhr:function() {
    var xhr = $.ajaxSettings.xhr();
    if (xhr.upload) {
    xhr.upload.onprogress = function(e) {
    if (e.lengthComputable) {
    var percent = Math.floor( e.loaded / e.total * 100);
    console.log(percent);
    vm.totals =percent;
    }
    };
    }
    return xhr;
    },
    success:function(result){

    }
    });
    }
    });

    <?php
    }

    add_action('wp_ajax_uploadimgs','uploadimgs');
    add_action('wp_ajax_nopriv_uploadimgs','uploadimgs');
    function uploadimgs(){
    require_once(ABSPATH . 'wp-admin/includes/image.php');
    require_once(ABSPATH . 'wp-admin/includes/file.php');
    require_once(ABSPATH . 'wp-admin/includes/media.php');
    $z = media_handle_upload('file','');
    print_r("");
    print_r(wp_get_attachment_image_src($z, 'full'));
    // $fileId = wp_upload_bits($_FILES['file']['name'], null, file_get_contents($_FILES['file']['tmp_name']));
    // print_r($fileId);

    // $upload_img = $_FILES['file'];
    // $fileName = $upload_img['name'];
    // $min_type = $upload_img['type'];
    // $post_id = $upload_img['post_id'];
    // if($upload_img['error'] == 0){
    // $md5 = md5_file($upload_img['tmp_name']);
    // //检测文件知否存在
    // $attachment = get_attached_file($md5);
    // if(!$attachment){
    // //上传文件
    // $a_data = array(
    // 'guid' => $md5,
    // 'post_mime_type' => $min_type,
    // 'post_title' => $fileName,
    // 'post_content' => '',
    // 'post_status' => 'inherit',
    // );
    // $att_id = wp_insert_attachment($a_data,$post_id);
    // $url = wp_get_attachment_image_src($att_id);
    // print_r($url);
    // }
    // }
    }

    回复

发表评论

Optimized by WPJAM Basic