如何在jQuery UI中为多个自动填充文本框和隐藏字段分配一个值？

Question

我有多个自动完成文本框与多个隐藏字段配对。我怎么做？防爆。 textbox1：name = hiddenfield1：Id，textbox2：name = hiddenfield2：Id。 我已经能够做1自动完成和1隐藏字段的工作。

这里是我的脚本代码：

<script type="text/javascript"> 
    $(document).ready(function() { 
     $('.auto').autocomplete({ 
      source: "search.php", 
      focus: function(event, ui) { 
       $(idField).val(ui.item.value); 
       $(this).val(ui.item.label); 
       return false; 
      }, 
      select: function(event, ui) { 
       $(this).val(ui.item.label); 
       $("#hidden").val(ui.item.value); 
       return false; 
      } 
      //minLength: 3 
     }); 
    }); 
</script> 

<p>Type the name of a band: <input type="text" class="auto" /></p> 
<p>Type the name of a band: <input type="text" class="auto" /></p> 

<input name="hidden" id="hidden" type="hidden" /> 
<input name="hidden" id="hidden" type="hidden" /> 

先生/女士你的答案会有很大的帮助，非常感谢。

Answer 1

首先，您需要所有输入字段的唯一标识符，隐藏或不隐藏。然后给它们赋值会容易很多。你真的很近，我只改变一些事情来得到它的工作，大多与该元素的ID，你正在使用要做到：

<script type="text/javascript"> 
    $(document).ready(function() { 
     $('.auto').autocomplete({ 
      source: "search.php", 

      ... 

      select: function(event, ui) { 

       // figure out which auto we're using and get it's 
       // associated hidden field... 
       var element_id = $(this).attr('id'); 
       var hidden_element_id = element_id + "_hidden"; 

       // set the appropriate fields' values... 
       $(this).val(ui.item.label); 
       $("#"+hidden_element_id).val(ui.item.value); 

       return false; 
      } 

      ... 

     }); 
    }); 

</script> 

<p>Type the name of a band: <input type="text" class="auto" id="auto1" /></p> 
<p>Type the name of a band: <input type="text" class="auto" id="auto2" /></p> 

<input name="hidden" id="auto1_hidden" type="hidden" /> 
<input name="hidden" id="auto2_hidden" type="hidden" /> 

其中一个更简单的方法来隐藏字段关联与可见的同行...你得到当前正在自动填充的元素的ID，然后通过将'_hidden'附加到它的ID属性上来获取它的隐藏字段对应物......有意义吗？

不要忘记更改字段的ID属性！希望这可以帮助！