jQuery自動完成變量範圍

Question

我在這個函數中的變量範圍有問題。基本上，當用戶專注於一個將有jQuery下拉列表的文本框時，我想將舊值保存在文本框中（如果存在以便在需要時恢復它）。我也試圖在功能之外聲明previous，並且試圖聲明window.previous但沒有成功。問題是，當我使用previous變量從.dropdown函數中，我總是把它找回來爲undefined

// Delete option allows a user to delete the value directly from the textbox associated with the dropdown. 
// Otherwise he will be warned and always forced to make a choice. 
// With value will add an extra value to a textbox that has _val apended to the current id 
// Create new, if set will open a new confirmation to add the item to the dropdown list 
function acomplete(element, source, deleteoption, withvalue, createnew, createtable, createcolumn, retid) { 
    var previous; 
    // Add arrow as this is a dropdown 
    $(element).addClass("dropdown"); 
    $(element).autocomplete({ 
     source: source, 
     minLength: 0, 
     global: false, 
     select: function (event, ui) { 
      if (withvalue == true) { 
       $("#" + $(this).attr("id") + "_val").val(ui.item.thevalue); 
       //$("#" + $(this).attr("id") + "_val").trigger("change"); 
      } 
      // Update hidden on select option 
      $("#" + $(this).attr("id") + "_id").val(ui.item.id); 
      // For items that have change event bound trigger ot so we are updating data in table. 
      $("#" + $(this).attr("id") + "_id").trigger("change"); 
     }, 
     focus: function (event, ui) { 
      // Save old value for backup 
      previous = this.value; 
     }, 
     change: function (event, ui) { 
      //alert($(this).val()); 
      if (!ui.item && $(this).val().length > 0) { // Item not selected in the dropdown list 
       $.ajax({ 
        url: "ajax/check_dropdown_item_exists.php", 
        global: false, 
        method: "POST", 
        data: { 
         table: createtable, 
         colnames: createcolumn, 
         colvals: encodeURI(String($(this).val().toUpperCase())), 
        }, 
        success: function (data) { 
         if (data != "TRUE") { 
          // Ask confirm to add new item to table 
          $.confirm('ITEM DOES NOT EXIST! ADD TO LIST?', function (answer) { 
           if (answer) { 
            $.ajax({ 
             url: "inc/insert_table_field.php", 
             global: false, 
             method:"POST", 
             data: { 
              table: createtable, 
              colnames: createcolumn, 
              colvals: String($(this).val().toUpperCase()), 
              retid: retid, 
             }, 
             success: function (data) { 
              if ($.isNumeric(data)) { 
               $("#" + $(element).attr("id") + "_id").val(data); 
               // Set the newly created value in dropdown 
               //$(element).val(String($(element).val().toUpperCase())); 
               // And update DB 
               $("#" + $(element).attr("id") + "_id").trigger("change"); 
              } else { 
               $.alert(data); 
              } 
             }, 
             error: function() { 
              $.alert('ERROR CREATING THE NEW ITEM!'); 
             } 
            }) 
           } else { 
            alert(previous) 
            // NO so blank 
            $(this).val(previous).focus(); 
           } 
          }) 
         } else { 
          // Commit change with value that already exists 
          // fecth item id and trigger select event 
          $.ajax({ 
           url: "ajax/get_dropdown_item_id.php", 
           global: false, 
           method: "POST", 
           data: { 
            table: createtable, 
            colnames: createcolumn, 
            colvals: String($(element).val().toUpperCase()), 
            retid: retid, 
           }, 
           success: function (data) { 
            if ($.isNumeric(data)) { 
             $("#" + $(element).attr("id") + "_id").val(data); 
             $("#" + $(element).attr("id") + "_id").trigger("change"); 
            } 
           } 
          }) 
         } 
        } 
       }) 
      } else { 
       $(this).val((ui.item ? ui.item.label : "")); // If empty put back the last one 
       if (!ui.item) { 
        if (deleteoption !== true) { 
         this.value = ""; 
         $.alert('YOU CAN SELECT FROM DROPDOWN ONLY!'); 
         $(element).val(element.oldvalue).focus(); 
        } else { 
         $("#" + $(this).attr("id") + "_id").val(""); 
         $("#" + $(this).attr("id") + "_id").trigger("change"); 
        } 
       } 
      } 
     } 
    }).dblclick(function() { 
     $(this).autocomplete("search", ""); 
    }).click(function() { 
     $(this).autocomplete("search", ""); 
    }) 
} 

Answer 1

的問題是，重點不着眼於文本框/輸入做出反應，而是結果從自動完成。

這意味着當您在文本框中單擊時，只有在選擇結果時功能焦點纔會啓動。

你拿以前的將是最好的解決辦法：

$(your element).click(function() { 
    previous = $(this).val() 
} 

這是jQueryUI的自動完成功能的文檔：

焦點（事件，UI）

觸發時焦點移動到一個項目（不選擇）。默認操作是將文本字段的值替換爲焦點項目的值，但只有在事件是由鍵盤交互觸發的情況下。 取消此事件可防止更新該值，但不會阻止菜單項被聚焦。

focus documentation