jQuery AjaxUpload，需要点击两次按钮吗？

Question

jQuery AjaxUpload，需要点击两次按钮吗？

3

我可以担任翻译。以下是您需要翻译的内容：

我正在使用jQuery的AjaxUpload插件，大部分功能都正常工作，但我必须点击两次我的按钮才能执行。我猜这是一个范围问题...或者(?)还在学习...

这是我的代码：

    $(".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);
      }  
   });

欢迎提出任何想法。:)

- TwstdElf

请编辑您的帖子（代码），因为它很难阅读。 - Reigel Gallarde

6个回答

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（这将防止重复点击）。

- fnd99

2

如果您正在创建一个动态按钮，您需要为每个按钮创建一个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标签，您需要添加class属性

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

- Fernando Quiroz

0

尝试这个：

   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);
      }  
   });

- Reigel Gallarde

0

<script type="text/javascript">

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

              new AjaxUpload('#yourlinkorbutton'),{

                  ....

              });
     });

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

这将在页面加载时为您提供两个点击。从那以后只需一个点击。

- dje2e4

为了提高您的帖子质量，请说明您的帖子如何/为什么能解决问题。 - Mick MacCallum

0

如果您正在使用动态控件，那么我们可能会遇到双击的问题，我已经解决了这个问题，并且它对我有效。

我花了两天时间解决这个问题，请检查以下步骤：

在 PHP 循环中添加 JavaScript 加载函数，如下所示：

<?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 循环中获取动态 ID。

function  uploadphoto(id)
{

new AjaxUpload('#photo'+id, {

所以，你可以在上面的示例行中传递动态ID，就这样 :) 祝编码愉快

- Suresh Sekar

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- TwstdElf · Accepted Answer

已经解决了 - 对于其他可能遇到类似问题的人，以下是解决方法...

主要问题在于这些按钮是动态创建的，在.live()调用中不会最初绑定AjaxUpload，因此需要"点击、移动、再次点击、触发"。

通过在循环中调用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);
        }       
    });
}

希望这对有需要的人有所帮助，我知道这个问题让我烦了几天。祝福。