Javascript变量作为数组工作

我已经动态地创建了jquery选项卡。我想重命名标签。当我点击选定的标签。一个文本框出现在模糊处，它将文本框的值设置为选项卡。再次，当我试图为另一个选项卡执行此操作时，它将重命名当前和较早的选项卡。等等...Javascript变量作为数组工作

Live Demo on JS Fiddle

$(document).ready(function() { 
$("#tabs").tabs({ 
    tabTemplate: "<li><a href='#{href}'>#{label}</a> <p title='close' id='removeTab' style='cursor:pointer;display:inline'>x</p></li>" 
}); 
}); 

$(function() { 

    for (i=0; i<3; i++){ 
    var title = '<span id="a'+i+'">Tab..... ' + i; 
     var url = '#fragment-' + i; 
     addTab(url, title, i); 
    } 
    var index =10; 
    index++; 
    $("#addTab").live('click', function() { 
     index++; 
     var title = '<span id="a'+index+'">Tab..... ' + index; 
     var url = '#fragment-' + index; 
     addTab(url, title, index); 

    }); 
function addTab(url, title, index) { 

    $('#tabs').tabs("add", url, title, [index]); 
    $('#a'+index).click(function(){ 
      var _current = '#a'+index 
      if($(_current).parent().parent().hasClass('ui-tabs-selected')){ 
       $(_current).hide(); 
       $('#editTabName').stop(false, true).hide(); 
       var nameField = '#editTabName'; 
       $(nameField).css({ 
         top: '12px', 
         left: $(this).parent().offset().left + 8+'px', 
         zIndex:100, 
         position:'absolute' 
        }); 
      $(nameField).val($(_current).html()); 
       $(nameField).show(50); 
       $(nameField).focus(); 
       $(nameField).blur(function(){ 
        alert(_current); 
        newName = $(nameField).val(); 
        $(_current).html(newName); 
        $(nameField).hide(); 
        $(_current).show(); 
       }); 
      } 
     }); 
} 


$('#removeTab').live('click', function() { 
    var $tabs = $('#tabs').tabs(); 
    var selected = $tabs.tabs('option', 'selected'); 
    if(selected == -1) 
     selected = $('p[id=removeTab]').index(this); 
    $('#tabs').tabs("remove", [selected]); 
}); 
});

来源

2012-07-23 Muhammad Usman

'变种指数= 10; index ++;'??? – elclanrs 2012-07-23 06:16:47

这只是为了手动创建标签 – 2012-07-23 06:17:33

为什么在之外有一个额外的''？使用jQuery动态创建输入！ – 2012-07-23 06:21:05

你每次当你重命名时设置绑定事件。 $(nameField).blur(function(){})实际上不会覆盖以前的模糊，它只会附加功能。所以你需要在添加新函数之前解除绑定。 $(nameField).unbind('blur');

所以功能将

function addTab(url, title, index) { 
    $('#tabs').tabs("add", url, title, [index]); 
    $('#a'+index).click(function(){ 
     var _current = '#a'+index; 
     if($(_current).parent().parent().hasClass('ui-tabs-selected')){ 
      $(_current).hide(); 
      $('#editTabName').stop(false, true).hide(); 
      var nameField = '#editTabName'; 
      $(nameField).css({ 
        top: '12px', 
        left: $(this).parent().offset().left + 8+'px', 
        zIndex:100, 
        position:'absolute' 
       }); 
      $(nameField).val($(_current).html()); 
      $(nameField).show(50); 
      $(nameField).focus(); 
      $(nameField).unbind('blur');     
      $(nameField).blur(function(){ 
       alert(_current); 
       newName = $(nameField).val(); 
       $(_current).html(newName); 
       $(nameField).hide(); 
       $(_current).show(); 
      }); 
     } 
    }); 
}

来源

2012-07-23 06:37:16 Jithin

使用一个，而不是模糊。

$(nameField).blur(function()

变为：

$(nameField).one('blur', function(){

http://jsfiddle.net/k44Wk/18/

来源

2012-07-23 06:42:50 wayne

Javascript变量作为数组工作

回答

相关问题