每4位數字輸入後調用Ajax

用戶輸入類似於'XXXX XXXX XXXX XXXX'，現在我想進行一次Ajax調用，以便每當用戶輸入4位數字時從Db獲取數據，然後在用戶輸入下一個Ajax時調用鍵入更多4位數字以獲得更精確的結果。每4位數字輸入後調用Ajax

$('#myInput').on('change', function(){ 

    // Don't exactly know what to do here // 

    var myData = $(this).val(); 

    if(myData > 4){ 
    $.ajax({ 
     type : 'get', 
     url : 'myUrl.php?data='+myData, 
     success : function(data){ 
     $('myDataDiv').html(data); 
     } 
    }); 
    } 
});

來源

2017-09-26 AshhaR

更準確地說，第一個Ajax調用應該在4位輸入上進行，第二個Ajax調用在8位輸入上進行，等等。 – AshhaR

使用if(myData.length && myData.length % 4 == 0)這將讓您的字符串的長度，如果你想要讓你需要處理的還有4個組之間的空格模4比0 。

來源

2017-09-26 10:43:40 user3154108

@Andreas好點。我添加了一個小編輯來處理這個問題。 – user3154108

你應該對所有這4個輸入使用class，然後用類改變jquery選擇器，如下所示。

$('.myInput').on('change', function(){ // consider `myInput` is class... 

    var myData = $(this).val(); 

    if(myData.length % 4 == 0){ 
    $.ajax({ 
     type : 'get', 
     url : 'myUrl.php?data='+myData, 
     success : function(data){ 
     $('myDataDiv').html(data); 
     } 
    }); 
    } 
});

，因爲如果你會使用ID喜歡#myInput然後jQuery將考慮DOM的頂部只有第一個ID，並按照預期的代碼可能無法正常工作。

來源

2017-09-26 10:42:30

只有一個輸入不是四個輸入 – AshhaR

好的，那麼你可以保持jquery選擇器的狀態，但是，然後改變'if'條件來檢查長度以考慮每4個元素。我已經用適當的「if」條件更新了我的答案。 –

var myData = $(this).val();這一行會給你在文本框中的價值。要獲得輸入中的字符數量，您必須使用.length。

var myData = $(this).val(); 
if((myData.length % 4) === 0){ 

}

來源

2017-09-26 10:42:48

_「...每4位數輸入後」_ – Andreas

但是，當用戶輸入下4位數字時，這可以使另一個Ajax呼叫嗎？首先要在4位輸入上進行Ajax調用，在8位輸入上進行第二次Ajax請求，等等。 – AshhaR

每4位數字輸入後調用Ajax

回答

相關問題