Question

<script type="text/javascript">
    $(document).ready(function () {
        new AjaxUpload('upload-button', {
            action: '<?php echo SITEURL; ?>uploading_script/upload',
            responseType: 'json',
            onSubmit: function (file, ext) {
                $.post("<?php echo SITEURL; ?>events/gl_event/gl_get_file_name/" + file);
                // Allow only images. You should add security check on the server-side.
                if (ext == 'jpg' || ext == 'jpeg' || ext == 'png' || ext == 'gif') {
                    /* Change status text */
                    $('#upload-div .text').text('Uploading ' + file);
                    directory = $('select').val();
                    this.setData({
                        'directory': directory
                    });
                    $('#loader_overlay').show();
                    $('#loader').show();
                    //this.disable();
                } else {
                    // extension is not allowed
                    $('#upload-div .text').text('Error: only image file allowed');
                    // cancel upload
                    return false;
                }
            },
            onComplete: function (file, response) {
                $('#loader').hide();
                $('#loader_overlay').hide();
                if (response && /^(success)/i.test(response.status)) {
                    $('#upload-button').hide();
                    $('#upload-div .text').html('<span style="color:#2284BC; z-index:20000000000;">Uploaded Image :</span> ' + file + '<br><a href="javascript:void(0);" id="remove" style="color:#2284BC; font-weight:bold;">Remove</a><br><a id="example4" href="<?php echo base_url();?>uploads/<?php echo date('
                    m '); ?>/<?php echo $this->session->userdata('
                    user_id ');?>/' + file + '"s><span style="color:#2284BC; z-index:20000000000;" class="last">Preview</span></a>');
                    $('#file_name').val(file);
                    //$('#gl_biz_bg').val(file);
                    file_nm = file.replace(" ", "_");
                    $('#remove').click(function () {
                        $('#upload-button').show();
                        $('#upload-div .text').html('');
                        $('#file_name').val('');
                        $('#gl_biz_bg_val').val('');
                        $('.get_fnt_color').css('color', '#' + '006EDE');
                        //$('#link_col').val('#666666');
                        $('.get_link_color').css('color', '#' + 666666);
                        $('.gl_biz_bg').css('background-image', 'url(<?php echo base_url(); ?>images/white_bg.png)');
                        /* Delete the file */

                        $.ajax({
                            url: "<?php echo SITEURL;?>events/gl_event/gl_remove_file",
                            type: 'POST',
                            data: "filename=" + file,
                            success: function (msg) {
                                //alert(msg);
                            }
                        });

                    });
                    //$('#upload-button').html('Upload Another Image');
                    //$('#upload-button').html("<img src='<?php echo base_url();?>images/change_logo.png' alt='upload logo'>");
                } else {
                    alert('Error uploading file (' + file + ')! \n' + response.issue);
                    $('#upload-div .text').html('Upload FAILED');
                }
            },
            error: function (x, e) {
                if (x.status == 0) {
                    alert('You are offline!!\n Please Check Your Network.');
                } else if (x.status == 404) {
                    alert('Requested URL not found.');
                } else if (x.status == 500) {
                    alert('Internel Server Error.');
                } else if (e == 'parsererror') {
                    alert('Error.\nParsing JSON Request failed.');
                } else if (e == 'timeout') {
                    alert('Request Time out.');
                } else {
                    alert('Unknow Error.\n' + x.responseText);
                }
            },
        });
    });
</script>//this is my ajax function        

<script type="text/javascript" src="<?php echo base_url();?>fancybox/jquery.fancybox-1.3.4.pack.js"></script>
    <link rel="stylesheet" type="text/css" href="<?php echo base_url();?>fancybox/jquery.fancybox-1.3.4.css" media="screen" />
    <script type="text/javascript" src="<?php echo base_url();?>fancybox/jquery.mousewheel-3.0.4.pack.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("a#example4").fancybox({
                'opacity'       : true,
                'overlayShow'   : false,
                'transitionIn'  : 'elastic',
                'transitionOut' : 'none'
            });
});
</script>
//This is my jquery function


<div class="fl" id="upload-div"><label class="text pl20"></label>
                                           <div class="fl biz_gary_btn width57" id="upload-button" >
                                              <div>
                                                <div class="fnt10 c58595b uppercase" style="width:55px">BROWSE

                                            </div>
                                            </div>
// this is my html code. Now the code you have given me where should i add that?

Answer 1

在ajax响应后初始化。

var initialized = false; 
$('#example').live('click', function() {
  if (initialized === false) {
    initialized = true;
    $('#example').fancybox({...}).click();
  }
})

这是脏的解决方法：）

Answer 2

尝试将您的javascript代码放在上传器div中。

`<div class="fl" id="upload-div">
//your scripts here ..
//your html here...

</div>`

在ajax上传函数后，jquery无法正常工作

2 个答案: