jQuery AjaxUpload, дважды нажать кнопку?

Question

Я использую плагин AjaxUpload с jQuery, и по большей части все работает нормально, но мне нужно дважды нажать мою кнопку, чтобы запустить его. Я предполагаю, что это проблема масштаба ... или (?) Все еще учусь ...

Вот мой код:

    $(".upload-button").live("click", function(event) {
       event.preventDefault();
       var currentId = $(this).closest("div").attr("id").replace("slide-", "");
       new AjaxUpload($(this), {
         action: "./php/upload.php",
         name: 'userfile',
         autoSubmit: true,
         onSubmit: function(file , ext) {
       },
       onComplete: function(file, response) {
         // enable upload button
         // this.enable();
         $("#slide-" + currentId).find(".movie-image").attr("src", baseImgPath + file);
         $("#mImg" + currentId).val(file);
      }  
   });

Любые идеи приветствуются. :)

Answer 1

Если вы создаете динамическую кнопку, вам нужно создать AjaxUpload, используя ID для каждой кнопки, попробуйте это:

// to add new button                                                                                                                                  
$("#add_sector").click(function() {
    var ID = [Generate a new ID];
    var button = '<a href="javascript:;" id="' + ID + '" class="subir_imagen"><img src="images/icon_subir32.png"></a>';


    $('#cont_img_catalogo').append(button);

    //create Ajax                                                                                                                                     
    new AjaxUpload($('#' + ID ),{
      action: 'procesar_imagen.php',
          name: 'image',
          onSubmit : function(file, ext){
          // desabilitar el boton                                                                                                                     
          this.disable();
          ...
            },
          onComplete: function(file, response){
          // Habilitar boton otra vez                                                                                                                 
          this.enable();

          ...

            }
      });



  });

Для удаления кнопки используйте:

$('#' + ID).fadeOut("slow", function() { $('#' + ID).remove(); });

если вы используете img, вам нужен класс

a, a:visited{
display: block;
float: left;
text-decoration:none;}

Answer 2

Попробуйте это:

$(".upload-button").live("hover", function(event) {

   var currentId = $(this).closest("div").attr("id").replace("slide-", "");
   new AjaxUpload($(this), {
     action: "./php/upload.php",
     name: 'userfile',
     autoSubmit: true,
     onSubmit: function(file , ext) {
         //onsubmit code here..
     },
     onComplete: function(file, response) {
         // oncomplete code here
     }  
   });
   $(this).trigger('click');   

});

Шахта работает, но я не совсем уверен, как она работает. «Hover» (вместо «click») создаст новый AjaxUpload (это предотвратит повторное нажатие на него)

Answer 3

Получилось - вот как у кого-то еще может быть похожая проблема ...

Основная проблема заключалась в том, что эти кнопки создавались динамически, и AjaxUpload не будет изначально привязан в вызове .live (), поэтому «щелкни, перемести, кликни еще раз, сработай».

Вызывая AjaxUpload (обернутый в его собственную функцию, как показано ниже), в моем цикле, когда кнопки создаются, они изначально связаны и функционируют должным образом.

Строка, используемая в цикле:

makeUpButton(("#upload-button-" + slideCount), slideCount);

Вызов AjaxUpload:

function makeUpButton(theButton, theId) {
    new AjaxUpload(theButton, {
        action: "./php/upload.php",
        name: 'userfile',
        autoSubmit: true,
        onSubmit: function(file , ext) {
            this.disable();
        },
        onComplete: function(file, response) {
            this.enable();
            $("#slide-" + theId).find(".movie-image").attr("src", baseImgPath + file);
            $("#mImg" + theId).val(file);
        }       
    });
}

Надеюсь, это кому-нибудь поможет, я знаю, это сводило меня с ума в течение нескольких дней. ;) Приветствия.

Answer 4

Если вы используете динамическое управление, в этот раз мы сталкиваемся с проблемой в два клика, я решил, что это работает для меня. я потратил два дня и решил, пожалуйста, проверьте следующие шаги: =

Добавить функцию загрузки java-скрипта в php looping для каждого использования ниже

<?php
for ($i=1; $i<=5; $i++)
  {
?>
<script>
$(window).load(function () 
        {
        uploadphoto(<?php echo $i; ?>)                
            });
</script>
<a href="javascript:void(0)" id="photo<?php echo $i; ?>" onclick="uploadphoto(<?php echo $i; ?>)" style="color: #666;"> Upload </a>
<?php

}
?>

и ваш файл javascript вы можете получить динамический идентификатор из цикла php

function  uploadphoto(id)
{

new AjaxUpload('#photo'+id, {

так что вы можете передать динамический идентификатор над строкой сэмпла, вот и все :) happy coding

Answer 5

<script type="text/javascript">

 $(document).ready(function() {
      $('#yourlinkorbutton').click(function(){

              new AjaxUpload('#yourlinkorbutton'),{

                  ....

              });
     });

     $('#yourlinkorbutton').trigger.click();
     $('#yourlinkorbutton').trigger.click();
});

, который даст вам два клика при загрузке страницы. оттуда один клик.

Answer 6

попробуйте это:

   var $button = $(".upload-button");
   new AjaxUpload($button, {
         action: "./php/upload.php",
         name: 'userfile',
         autoSubmit: true,
         onSubmit: function(file , ext) {
       },
       onComplete: function(file, response) {
         // enable upload button
         // this.enable();
         var currentId = $(this).closest("div").attr("id").replace("slide-", "");
         $("#slide-" + currentId).find(".movie-image").attr("src", baseImgPath + file);
         $("#mImg" + currentId).val(file);
      }  
   });