針對json/array的jQuery textfield驗證

我正在尋找解決方案來驗證textfield對由json文件提供的數組的輸入。例如：在註冊表單中檢查，如果所需的用戶名已存在。針對json/array的jQuery textfield驗證

誰能幫助與工作的例子，插件，腳本或教程？

的 'usernames.json' 看起來像這樣...

{"usernames":["carl","jack","jill"]}

...並讀出與...

$.getJSON("usernames.json", function(names) { 
var invalidName = names;

我會去上...

jQuery.validator.addMethod

...但是從現在開始，我很堅持。

如果有人可以幫忙做工作的例子，我會很高興！

////////////////////////////////////////////// //////

編輯：感謝Utkanos和Pavel Staseljun，我能想出以下解決方案，這是隻有大致測試！請在下面找到Utkanos的例子，因爲這個例子包含「keyup」操作，而不是「submit」，並且不包含「required」--check。「#errorresponse」是div，可能會顯示錯誤消息。

$.ajax({ 
    url: "http://yoururlto.json?callback=?", 
    dataType:"jsonp", 
    jsonpCallback: '?', 
    async: false, 
    success: function(json) { 
     $('#user').keyup(function(evt) { 
     var jsonarray = json.usernames; 
     var userinput = $('#user').val().toLowerCase() 
     var check = $.inArray(userinput, jsonarray); 
     if (check !== -1) { 
      $("#errorresponse").text('Thanks to Utkanos and Pavel Staseljun!'); 
      } 
     }) 
     } 
});

來源

2012-07-31 Elvis

HTML

<form id='signup'> 
    <label>Choose a username</label> 
    <input type='text' id='user' /> 
    <input type='submit' value='submit' /> 
</form>

JS/jQuery的

$.getJSON("usernames.json", function(json) { 
    $('#signup').on('submit', function(evt) { 
     var user = $('#user').val(), error; 
     if (!user) 
      error = 'no username entered'; 
     else if (json.usernames.indexOf(user) != -1) 
      error = 'username already taken'; 
     if (error) { evt.preventDefault(); alert(error); } 
    }); 
});

來源

2012-07-31 09:31:43 Utkanos

我想'如果（$ .inArray（$（ '＃用戶名'）VAL（），json.usernames）。）錯誤= '用戶名已經採取了';'，而不是'如果（json.usernames.indexOf（$ （'#username'）.val（））！= -1）error ='用戶名已被佔用';'更好..？ – 2012-07-31 09:35:13

嗯，是的，它更加跨瀏覽器。我只是喜歡ECMA5 :) – Utkanos 2012-07-31 09:36:47

非常感謝你們倆！這非常有幫助！ :-) – Elvis 2012-08-01 08:56:11

爲什麼你想從服務器發送所有用戶名到客戶端？這聽起來像一個非常糟糕的主意。請做一些類似於服務器端的功能，檢查發佈的用戶名，並返回真或假的有效或無效？如果用戶名存在

好多IMO

來源

2012-07-31 09:33:32 kannix

因爲我更喜歡某種「即時」驗證，所以json更快。這應該也適用於移動設備;在這種情況下，服務器端功能（如php）是不可能的。 – Elvis 2012-07-31 09:48:18

通過使用ajax，您可以使用「即時」驗證，尤其是在移動設備上，您將獲得相當快的速度，以保持10000個用戶名數組的速度比簡單的ajax請求慢得多。此外，如果每個客戶端都可以讀取所有用戶名，那麼這似乎是一個安全問題。 – kannix 2012-07-31 11:21:56

也許我們有一個誤解？我確實使用ajax/js進行驗證。 :-) 事實上，我已經選擇了「用戶名」 - 場景作爲示例，以使問題更常見。有兩個驗證步驟：一個是發送表單之前（客戶端），另一個是通過php（服務器端）處理提交。因此，在這種情況下，它只是快速的客戶端解決方案。 – Elvis 2012-08-01 08:10:28

你能不能創建一個AJAX腳本檢查，因爲你可以直接將其與使用遠程選項的jQuery驗證集成。

來源

2012-07-31 09:33:42 dead

你說得對，這可能是一個解決方案，但在這種情況下，我正在尋找客戶端「預驗證」。 – Elvis 2012-08-01 08:14:26

針對json/array的jQuery textfield驗證

回答

相關問題