jQuery ajax给所有div相同的结果 [英] jquery ajax is giving the same result to all divs

问题描述

我正在尝试能够重命名文件.目前，它正在工作，但是， 例如，假设我有:

I am trying to be able to rename files. At the moments its working but, for example lets say i have:

文件一个名称为'hello'，文件两个名称为'bye'，文件三个名称为'hey'

file one name is 'hello', file two name is 'bye', file three name is 'hey'

然后我将文件1重命名为"something"，它将对其重命名，但是如果我随后将文件2重命名为"youarecool"，它将重命名文件1和2.

and i rename file one to 'something' it will rename it, but if i then rename file two to 'youarecool' it will rename file one and two that.

这是我的JavaScript，我在做什么错.这是我的jsfiddle. http://jsfiddle.net/RSvre/

here is my javascript, what am i doing wrong. here is my jsfiddle. http://jsfiddle.net/RSvre/

这是每个文件的html

here is the html for each of the files

 <div class="each_file">
         <span class="file_icon"><img src="img/file-icon/avi.png" /></span>
         <div class="file_details">
            <div class="file_title"><a class="fnl" href="#">filename</a></div>
               <div class="file_detail_stat">filesize | downloads Downloads | 
                Uploaded on   date</div>
               </div>
           <ul class="file_manage_icons">
               <li><a href="#">
               <span title="Email" class="mail" id="$auth"></span>
               </a></li>
               <li><a href="#"><span title="Edit" class="edit" id="$auth"></span></a></li>
               <li><a href="#"><span title="Lock" class="lock" id="$auth"></span></a></li>
               <li><a href="#"><span title="Delete" class="bin" id="$auth">
               </span></a> </li>
            </ul>
          <div class="clear"></div>
         </div>

这是JavaScript

and this is the javascript

$('.edit').click(function(e){

    e.preventDefault();
    var auth = $(this).attr('id');
    var each = $(this).closest('.each_file').find('.fnl');

    $.post( "ajax/edit_filename.php", { auth:auth })
       .done(function( data ) {

        $( "#dialog" ).dialog({
          modal: true,
          resizable: false,
          title: 'Edit file name',
          buttons: {
              "Close": function() {
                  $(this).dialog("destroy");
                  $(this).dialog("close");
              }
          } 
        });
        $('.ui-dialog-content').html('<input type="text" class="newfname" value="'+data+'"/><div class="btn_l"><input type="submit" class="submit_btn" id="edit_filenameb" value="Edit Name" /></div>');
    });

    $(document).on('click', '#edit_filenameb', function(e){
        e.preventDefault();
        var nname = $('.newfname').val();
        console.log(nname);

        if(nname == ''){
            $('.submit_btn').effect('shake');
        } else {
            $.post('ajax/change_filename.php', {nname:nname, auth:auth})
            .done(function(data){
                each.text(data);
                $('#dialog').dialog('close');
            });
        }
    });
});

推荐答案

我相信问题在于，每次重命名文件时，都会向document添加一个新的Click侦听器，但从未清除过它.重命名下一个时，它实际上调用了两个重命名函数.您可以将要重命名的文件的名称保存在变量中，然后在页面加载中设置的单击侦听器中重命名该文件.另外，您还必须有一种方法来告诉您是否已经发生了重命名，以便不会在每次页面单击时都调用它.

I believe the problem is that each time you rename a file, you add a new click listener to document, but you never clean it up. When you rename the next one it actually calls both rename functions. You could save the name of the file to be renamed in a variable, and then in a single click listener set on page load rename the file. Also you'd have to have a way to tell if the renaming has already occurred so that it won't be called on every page click.

这篇关于jQuery ajax给所有div相同的结果的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！