自動完成只工作了第一個輸入字段

-2

我試圖讓自動完成上用id =「火車」任何DIV工作然而，它似乎只工作在第一輸入字段與類「火車」自動完成只工作了第一個輸入字段

的

javascript代碼：

<script type="text/javascript"> 
$(document).ready(function() { 
    $(".train").each(function() { 
     $(".train").keyup(function() { 
     $("#suggest_q").html(""); 
      var train = $(".train").val(); 
      train = $.trim(train); 
      if(train) 
      { 
       $.ajax({ 

        url: "train_ajax_query.php", 
        data: "train="+train, 
        success: function(msg) { 
         $("#suggest_q").html(msg); 
         $("#suggest_q ul li").mouseover(function() { 
          $("#suggest_q ul li").removeClass("hover"); 
          $(this).addClass("hover"); 
         }) 
         $("#suggest_q ul li").click(function() { 
          var value = $(this).html(); 
          $("#train").val(value); 
          $("#suggest_q ul li").remove(); 
         }); 

        } 
       }); 
      } 
     }); 
    }); 

}); 

</script>

HTML代碼：

<form id="train_create_form" name="train" action="submit_train.php" method="POST"> 


    <input type="text" id="train" class="train" size="20" name="train[]" placeholder="Train 1" /> 
     <div id="suggest_q"> 

     </div> 
    <input type="text" id="train" size="20" class="train" name="train[]" placeholder="Train 2" /> 
     <div id="suggest_q"> 

     </div> 

    <input id= "submit_train" type="submit" name="submit_train" value="Submit All trains"> 
     </form>

我發現this old post，但我不知道如何採取修復我的問題:(

添加更多的輸入域代碼：

<script type="text/javascript"> 
$(function() { 
     var scntDiv = $('#p_scents'); 
     var i = $('#p_scents p').size() + 0; 

     $('#addScnt').live('click', function() { 
       $('<p><input type="text" id="train" name="train[]" class="train" placeholder="Train ' + i +'" /><div id="suggest_q"></div><a href="#" id="remScnt">Remove train</a></p>').appendTo(scntDiv); 
       i++; 
       return false; 
     }); 

     $('#remScnt').live('click', function() { 
       if(i > 2) { 
         $(this).parents('p').remove(); 
         i--; 
       } 
       return false; 
     }); 
}); 
</script>

來源

2012-10-20 Die 20

的ID值應該是唯一的（按[**規格**]（HTTP：//www.w3。組織/ TR/HTML401 /結構/ global.html＃H-7.5.2））。「id = name，這個屬性給一個元素賦一個名字，這個名字在文檔中必須是唯一的。」 – Styxxy

Beause這裏：

$(".train").each(function() { 
     $(".train").keyup(function() {

你每次只有第一場:)嘗試：

$(".train").each(function(index, element) { 
     element.keyup(function() { 
      // or even: $(element).keyup(function() {

參考文獻： Each KeyUp Val

我copypaste整個例如：

<script type="text/javascript"> 
$(document).ready(function() { 
    $(".train").each(function(index, element) { 
     $(element).keyup(function() { 
     $("#suggest_q").html(""); 
      var train = $(element).val(); 
      train = $.trim(train); 
      if(train) 
      { 
       $.ajax({ 

        url: "train_ajax_query.php", 
        data: "train="+train, 
        success: function(msg) { 
         $("#suggest_q").html(msg); 
         $("#suggest_q ul li").mouseover(function() { 
          $("#suggest_q ul li").removeClass("hover"); 
          $(this).addClass("hover"); 
         }) 
         $("#suggest_q ul li").click(function() { 
          var value = $(this).html(); 
          $(element).val(value); 
          $("#suggest_q ul li").remove(); 
         }); 

        } 
       }); 
      } 
     }); 
    }); 

});

來源

2012-10-20 20:08:08

我很抱歉安東，有點idk你的意思是......我應該刪除這兩行嗎？ –

否，替換$（「列車」）。每個（函數（）{具有$（「。列車」）。每個（函數（指數，元素）{和$（「。列車」）。KEYUP（（）的函數{使用$（元素）.keyup（函數（）{ –

安東，我試過了代碼，現在劇本不會產生自動完成的第一個要麼...任何其他建議？ –

每個輸入$(".train")的時候，你的所有元素再次搜索。

一旦你完成了你最初的$(".train").each(function() {線，你可以使用$（本）來引用元素，該函數將調用每個元素。

當您使用var train = $(".train").val();你所得到的第一個元素的只是價值。有關更多詳情，請參閱http://api.jquery.com/val/。

如果您刪除該行並僅使用$(this)而不是'''train'''，這應該會更好，但是您也希望擺脫.keyup（）周圍的.each（），因爲$(".train").keyup已經適用於所有匹配的元素。

你基本上是說「經過並找到所有列車元素，對於每一列列車元素，通過並設置所有列車列表元素的列表值，將其設置爲一個函數，在第一列列車元素上執行自動填充。你想被大家說：「每個列車單元設置KEYUP回調強制執行本身自動完成」

來源

2012-10-20 20:09:42 Eric

自動完成只工作了第一個輸入字段

回答

相關問題