如何修剪輸入到JQuery自動完成框？

有沒有什麼辦法在用戶輸入的jQuery自動填寫文本框<input>中修剪（刪除前導/尾部空格），然後將其與名稱列表進行匹配：值？我目前有一個文本框，用戶可以輸入名字。值對的jQuery：姓名，然後對名稱的列表匹配如何修剪輸入到JQuery自動完成框？

<script type="text/javascript"> 

var resources = [ 
       <?php 
        foreach($data['Resource'] as &$row){ 
         $Name = $row['Forename']." ".$row['Surname']; 
         echo "{"; 
         echo " label:'$Name',"; 
         echo " value:'$row[EmployeeNumber]'"; 
         echo "},"; 
        } 
       ?> 
       ]; 

    jQuery(function(){ 
     jQuery('#Resource').autocomplete({ 
      source: resources, 
      focus: function(event, ui) { 
       jQuery('#Resource').val(ui.item.label); 
       return false; 
      },   
      select: function(event, ui) { 
       jQuery('#Resource').val(ui.item.label); 
       jQuery('#EmployeeNumber').val(ui.item.value); 
       return false; 
      } 
     }); 
    }); 
</script>

我的問題是，如果用戶進入匹配一個在resources地圖，但後有空格的名稱，它贏得了」 t匹配，因此沒有值將被分配給輸入。如果可能的話，我想至少在這個映射上忽略尾隨空格（如果不是空格的話）。

此外，如果沒有找到地圖，是否可以爲輸入框添加默認值？

編輯：

順便說一句，是有可能在下拉自動完成框中顯示，如果用戶鍵入的東西不匹配不匹配的項目嗎？道歉後編輯。

來源

2010-07-22 Stephen

你可以做的發現自己的source功能，而不是使用the built-in function，像這樣：

source: function(request, response) { 
    var matcher = new RegExp($.trim(request.term).replace(/[-[\]{}()*+?.,\\^$|#\s]/g, "\\$&"), "i"); 
    response($.grep(resources, function(value) { 
    return matcher.test(value.label || value.value || value); 
    })); 
}

You can try a demo here。這會使用在傳遞到$.grep()之前削減搜索詞，以獲得所需的前導/尾隨空白無知效果。

爲了您的編輯，你可以這樣做，但「沒有結果......」都可以選擇，give it a try here：

source: function(request, response) { 
    var matcher = new RegExp($.trim(request.term).replace(/[-[\]{}()*+?.,\\^$|#\s]/g, "\\$&"), "i"); 
    var matches = $.grep(resources, function(value) { 
    return matcher.test(value.label || value.value || value); 
    }); 
    response(matches.length ? matches : [{ label: 'No Result Found', value: '' }]); 
}

來源

2010-07-22 10:57:55

非常感謝尼克，這就像一個魅力！唯一的問題是我需要用jQuery替換「$」 - 我一開始並沒有發現「jQuery」丟失，並花了很長時間試圖想出可能導致它無法工作的複雜原因在我的最後！ – Stephen 2010-07-22 13:33:33

對不起，如果這看起來有點粗魯，但只是想檢查 - 有沒有辦法使'找不到結果'的選擇無法選擇，或者你只是不知道有任何其他方式來做到這一點？ – Stephen 2010-07-22 13:46:36

使用jQuery.trim：

jQuery.trim(yourValue);

來源

2010-07-22 09:45:45 James

對不起，我想我是不是我的問題不夠清楚（將在一分鐘內編輯它） - 在jQuery嘗試將它與映射列表進行匹配之前，我會在哪裏修剪數據以確保它被修剪？我的道歉，但以上只是主要從網上的一個例子 - 從未使用過的jQuery！ – Stephen 2010-07-22 09:48:03

@Stephen，你正在使用哪個自動完成的插件？ – James 2010-07-22 09:48:28

據我所知，我們正在使用[這一個]（http://docs.jquery.com/UI/Autocomplete）。謝謝。 – Stephen 2010-07-22 09:52:14

如何修剪輸入到JQuery自動完成框？

回答

相關問題