Question

我是jquery的新手。我有两个输入文本字段，我已设法通过以下函数在两个输入字段上附加自动提示列表

function lookup(inputString,tableName,colName,divId,listId) {
        if(inputString.length == 0) {
            // Hide the suggestion box.
            $(divId).hide();
        } else {
            $.post("customers.php", {queryString: ""+inputString+"",table:""+tableName+"",col:""+colName+""}, function(data){
                if(data.length >0) {
                    $(divId).show();
                    $(listId).html(data);
                }
            });
        }
    } // lookup

我的表单看起来像这样

    <div>
            <form>
                <div>
                    Location
                    <br />
                    <input type="text" size="30" value="" id="inputString" onkeyup="lookup(this.value,'countries','value','#suggestions','#autoSuggestionsList');" onblur="fillValues(this.value,'#inputString','#suggestions');" autocomplete="off"/>
                </div>

                <div class="suggestionsBox" id="suggestions" style="display: none;">
                    <img src="http://localhost/ci/css/images/upArrow.png" style="position: relative; top: -12px; left: 30px;" alt="upArrow" />
                    <div class="suggestionList" id="autoSuggestionsList"  >
                        &nbsp;
                    </div>
                </div>

                <div>
                    Favourite Product
                    <br />
                    <input type="text" size="30" value="" id="inputString1" onkeyup="lookup(this.value,'product','value','#suggestions1','#autoSuggestionsList1');"
"fillValues(this.value,'#inputString1','#suggestions1');"  autocomplete="off"/>
                </div>

                <div class="suggestionsBox" id="suggestions1" style="display: none;">
                    <img src="http://localhost/ci/css/images/upArrow.png" style="position: relative; top: -12px;left: 30px;" alt="upArrow" />
                    <div class="suggestionList" id="autoSuggestionsList1" >
                        &nbsp;
                    </div>
                </div>
            </form>
        </div>

和fillValues函数看起来像这样

function fillValues(thisVal,inputId,divId)
    {   
       $(inputId).val(thisValue);
       setTimeout("$("+divId+").hide();",200)

    }

现在，当用户点击列表中的值时，输入文本字段应填充该值。但是我无法这样做。我错过了什么？

P.S。自动提示列表已成功显示，我的customers.php工作正常。

Answer 1

我认为你的功能必须是这样的，oyu必须添加一个'＃'来定位一个带有id的元素

function fillValues(thisVal,inputId,divId)
    {   
       $("#"+inputId).val(thisValue);
       setTimeout("$(#"+divId+").hide();",200)

    }

使用其ID来定位元素我们使用'＃' 要使用它的类来定位元素，我们使用'。'

如何使用jquery填充输入文本字段？

1 个答案: