Question

我正在尝试添加多个产品。对于每个产品的名称我想给用户自动建议，但我能够给出第一个产品的自动建议。任何人都告诉我我做错了什么。

我的HTML代码

<label>Product Name 1.</label>
<input style="border:2px solid #7f9db9" name="product1" id="in_pc_item_moq_unit_type" class="ui-autocomplete-input"  maxlength="100" placeholder="Enter your product name" type="text">

<label>Product Name 2.</label>

<input style="border:2px solid #7f9db9" name="product2" id="in_pc_item_moq_unit_type" class="ui-autocomplete-input"  maxlength="100" placeholder="Enter your product name" type="text">

<label>Product Name 3.</label>
<input style="border:2px solid #7f9db9" class="ui-autocomplete-input"id="in_pc_item_moq_unit_type" maxlength="100" name="product3" placeholder="Enter your product name" type="text">

<label>Product Name 4.</label>

   <input style="border:2px solid #7f9db9"  class="ui-autocomplete-input" id="in_pc_item_moq_unit_type" maxlength="100" name="product4" placeholder="Enter your product name" type="text">

 <label>Product Name 5.</label>

   <input style="border:2px solid #7f9db9"  class="ui-autocomplete-input" id="in_pc_item_moq_unit_type" maxlength="100" name="product5" placeholder="Enter your product name" type="text">

我的Java脚本代码

   < script language="javascript" type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
    <script language="javascript" type="text/javascript" src="http://utils.imimg.com/suggest/js/jq-ac-ui.js"></script>
    <script type="text/javascript">
    function auto_suggest()
    {
        if(typeof(Suggester)!="undefined")
        {
            sugg=new Suggester({"element":"in_pc_item_moq_unit_type","onSelect":selecttext,"type":"mcat","placeholder":"Enter your product name","classPlaceholder":"ui-placeholder-input",minStringLengthToFetchSuggestion:1});
        }else
        {
            setTimeout(function(){
            auto_suggest()},50);
        }
    }
    auto_suggest();

    function selecttext(event, ui)
    {
        this.value = ui.item.value;

    }

    </script>

Answer 1

您使用此

的常用功能

使用以下代码并告诉我

function auto_suggest(id)
{
    if(typeof(Suggester)!="undefined")
    {
        sugg=new Suggester({"element":id,"onSelect":selecttext,"type":"mcat","placeholder":"Enter your product name","classPlaceholder":"ui-placeholder-input",minStringLengthToFetchSuggestion:1});
    }else
    {
        setTimeout(function(){
            auto_suggest(id)},50);
    }
}
auto_suggest('text-box-id-1');
auto_suggest('text-box-id-2');
auto_suggest('text-box-id-3');

function selecttext(event, ui)
{
    this.value = ui.item.value;

}

更新： -

你做错了什么都复制粘贴下面的代码。

HTML： -

你应该在html文档中没有相同的id。

<label>Product Name 1.</label>
<input style="border:2px solid #7f9db9" name="product1" id="in_pc_item_moq_unit_type1" class="ui-autocomplete-input"  maxlength="100" placeholder="Enter your product name" type="text">

<label>Product Name 2.</label>

<input style="border:2px solid #7f9db9" name="product2" id="in_pc_item_moq_unit_type2" class="ui-autocomplete-input"  maxlength="100" placeholder="Enter your product name" type="text">

<label>Product Name 3.</label>
<input style="border:2px solid #7f9db9" class="ui-autocomplete-input"id="in_pc_item_moq_unit_type3" maxlength="100" name="product3" placeholder="Enter your product name" type="text">

<label>Product Name 4.</label>

<input style="border:2px solid #7f9db9"  class="ui-autocomplete-input" id="in_pc_item_moq_unit_type4" maxlength="100" name="product4" placeholder="Enter your product name" type="text">

<label>Product Name 5.</label>

<input style="border:2px solid #7f9db9"  class="ui-autocomplete-input" id="in_pc_item_moq_unit_type5" maxlength="100" name="product5" placeholder="Enter your product name" type="text">

Javascript： -

  function auto_suggest(id)
    {
        if(typeof(Suggester)!="undefined")
        {
            sugg=new Suggester({"element":id,"onSelect":selecttext,"type":"mcat","placeholder":"Enter your product name 2","classPlaceholder":"ui-placeholder-input",minStringLengthToFetchSuggestion:1});
        }else
        {
            setTimeout(function(){
                auto_suggest(id)},50);
        }
    }
    auto_suggest('in_pc_item_moq_unit_type1');
    auto_suggest('in_pc_item_moq_unit_type2');
    auto_suggest('in_pc_item_moq_unit_type3');
    auto_suggest('in_pc_item_moq_unit_type4');
    auto_suggest('in_pc_item_moq_unit_type5');

    function selecttext(event, ui)
    {
        this.value = ui.item.value;

    }

如何将相同的自动完成操作应用于多个表单域

1 个答案: