jQuery使用自動完成功能限制文本框輸入

我正在使用jQuery UI的自動完成功能來爲表單傳播正確的輸入，超過1000個值。jQuery使用自動完成功能限制文本框輸入

自動完成工作正常，但我如何限制字段的值只是這些值？

自動完成代碼的形式：

$('#animal').autocomplete({ 
    source: "search_species.php", 
    minLength: 3, 
    select: function(event, ui) { 
     $('#animal').val(ui.item.postcodes); 
     $('#code').val(ui.item.code); 
     $('#family').val(ui.item.family); 
    } 
});

代碼自動完成中源：

$conn = mysql_connect($dbhost, $dbuser, $dbpass) or die ('Error connecting to mysql'); 
mysql_select_db($dbname); 
$return_arr = array(); 

if ($conn){ 
    $fetch = mysql_query(
     "SELECT * FROM animals where animals like '%" . mysql_real_escape_string($_GET['term']) . "%'" 
    ); 

    /* Retrieve and store in array the results of the query.*/ 
    while ($row = mysql_fetch_array($fetch, MYSQL_ASSOC)) { 
     $row_array['id'] = $row['id']; 
     $row_array['value'] = $row['animals']; 
     $row_array['family'] = $row['family']; 
     $row_array['code'] = $row['code']; 
     array_push($return_arr,$row_array); 
    } 
} 

mysql_close($conn); 
echo json_encode($return_arr);

正如我所說的，自動完成的作品。我只需要知道如何將文本字段中的值限制爲搜索中的值，以便人們無法輸入自己的值。

在此先感謝。

來源

2012-12-09 Rod

不知道，你可以阻止人們在輸入輸入另一個值，但可以防止人在提交 - 存儲所有的自動完成值在JavaScript陣列，當有人提出，你可以覈對這些值的形式來確保它的doinng .submit時通過它做一個環其中之一（功能可按（）{}）你不能只是做這個選擇列表，如果你只希望他們能夠從特定值選擇？ –

唯一的問題是列表中包含約1000個動物和相關代碼。它是一個野生動物救援組織，所有成員必須輸入特定的動物才能提出其野生動物編碼。 – Rod

是有可能的名單進一步下跌也許篩選或者你可以調用功能可按上.blur（函數（）{//看看是否值匹配}）而不是做.submit（） –

有幾種方法可以解決這個問題。

一種方法是在下拉列表中沒有任何內容被選中時清除輸入值，並在提交時強制該字段非空。清除值的一個好方法是在菜單更改或關閉時使用自動完成事件，名稱爲change。如果選擇了某個項目，或者輸入失去焦點，則會觸發此事件。如果用戶沒有從菜單中選擇一個項目，則ui.item值將爲空，您可以清除輸入中留下的類型值。

您可以實現這樣的方法：

$('#animal').autocomplete(
    { 
     source: "search_species.php", 
     minLength: 3, 
     select: function(event, ui) { 
      $('#animal').val(ui.item.postcodes); 
      $('#code').val(ui.item.code); 
      $('#family').val(ui.item.family); 
     }, 
     change: function(event, ui) { 
      if(ui.item === null || !ui.item) 
       $(this).val(''); /* clear the value */ 
     } 
    });

從這裏很簡單的在表單中添加驗證檢查，或者你使用什麼，以防止移動，除非一個項目是用戶選擇 - 確保輸入值不爲空。

來源

2013-03-15 02:08:28

http://api.jqueryui.com/autocomplete /＃事件關閉看到因爲'ui'總是空的，只是爲了一致性，我敢肯定，這是行不通的。 –

謝謝，'change'事件就是我的意思。它在模糊時觸發，如果沒有選擇任何內容，則'ui.item'爲null。更新。 –

jQuery使用自動完成功能限制文本框輸入

回答

相關問題