自动完成只工作了第一个输入字段

-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

自动完成只工作了第一个输入字段

回答

相关问题