Question

我正在尝试使用两个自动填充文本框，一个用于手机型号 - input1和一个用于固件 - input2在同一页面上。当两者都填充时我想要一个div用ID input1input2显示，但是当在input1中输入一个值时，它声称phone的变量是未定义的，当填写第二个时声称phoneid是未定义的。这是HTML

<div id="formcontainer">
<input id="input1"/>
<input id="input2"/>
</div>
<div id="iphone2g1.1" class="info" style="display:none">iPhone 2G</div>
<div id="iphone2g1.2" class="info" style="display:none">iPhone 3G</div>
<div id="iphone2g1.3" class="info" style="display:none">iPhone 3GS</div>
<div id="iphone2g1.4" class="info" style="display:none">iPhone 4</div>
<div id="iphone2g1.5" class="info" style="display:none">iPhone 4S</div>

的jQuery

$("#input1").autocompleteArray(["iPhone 2G","iPhone 3G","iPhone 3GS","iPhone 4","iPhone 4s"],
    {   minChars:1,
        matchSubset:1,
        onItemSelect:selectPhone,
        onFindValue:findPhone,
        autoFill:true,
        maxItemsToShow:10,
        selectFirst:true,
    });

$("#input2").autocompleteArray(["1.1","1.2","1.3","1.4","1.5"],
{   minChars:1,
    matchSubset:1,
    onItemSelect:selectFirmware,
    onFindValue:findFirmware,
    autoFill:true,
    maxItemsToShow:10,
    selectFirst:true,
    });

function findPhone(li) {
    if( li == null ) return alert("No match!");
    var phone = li.selectPhone;
    var phoneid = phone.replace("iPhone ","iphone").toLowerCase();
};

function findFirmware(li) {
    if( li == null ) return alert("No match!");
    var firmware = li.selectFirmware;
    $(".info").hide
    $(phoneid+firmware).show
};

function selectPhone(li) {
    findPhone(li);
}

function selectFirmware(li) {
    findFirmware(li);
}

我正在使用this作为自动完成插件。该页面可以查看here。

感谢。

EDIT1 现在这就是jQuery的样子，但它仍然会引发同样的错误。

    var phone;
    var phoneid;
    var firmware;
    var firmwareid;

$("#input1").autocompleteArray(["iPhone 2G","iPhone 3G","iPhone 3GS","iPhone 4","iPhone 4s"],
{   minChars:1,
    matchSubset:1,
    onItemSelect:selectPhone,
    onFindValue:findPhone,
    autoFill:true,
    maxItemsToShow:10,
    selectFirst:true,
});

$("#input2").autocompleteArray(["1.1","1.2","1.3","1.4","1.5"],
{   minChars:1,
    matchSubset:1,
    onItemSelect:selectFirmware,
    onFindValue:findFirmware,
    autoFill:true,
    maxItemsToShow:10,
    selectFirst:true,
    });



function findPhone(li) {
    if( li == null ) return alert("No match!");
    phone = li.selectPhone;
    phoneid = phone.replace("iPhone ","iphone").toLowerCase();
};

function findFirmware(li) {
    if( li == null ) return alert("No match!");
    firmware = li.selectFirmware;
    firmwareid = phone.replace(".","");
    $(".info").hide
    $(phoneid+firmware).show
};

function selectPhone(li) {
    findPhone(li);
}

function selectFirmware(li) {
    findFirmware(li);
}

Answer 1

这可能是一个范围问题。尝试将其添加到脚本的顶部：

var phone;
var phoneid;

随后省略var

phone = li.selectPhone;

Answer 2

它没有定义findFirmware()函数可以访问的任何地方 - 它在var中被定义为findPhone()，因此是该函数的本地。

不确定li.selectFirmware之类的东西是什么意思，但那些也会破坏。

Answer 3

问题在于id。{/ p>中的.字符

基本上，名称必须以下划线（_），短划线（ - ）或a开头字母（a-z），后跟任意数量的破折号，下划线，字母，或数字。有一个问题：如果第一个字符是破折号，那么第二个字符必须是字母或下划线，名称必须是至少2个字符。

Which characters are valid in CSS class names/selectors?

Answer 4

问题是div的ID属性和findFirmware()函数中的句点，将其更改为

function findFirmware(li) {
    if( li == null ) return alert("No match!");
    firmware = li.selectFirmware;
    firmwareid = phone.replace(".","");
    $(".info").hide();
    $('#' + phoneid + firmwareid).show(); // This line was messed up
};

此行$(phoneid+firmware).show存在两个问题，如果计算缺少的括号和分号，则有四个问题，但是......

您尝试展示的div有ID，您的选择器中没有#来按ID选择元素
firmware包含带有句点的未解析字符串，因此当您的div ID为phoneid + firmware时，iphone2g1.2变为iphone2g12，因此您需要使用firmwareid解析了它。

小提琴演示：http://jsfiddle.net/AaNWM/

jQuery变量声明它在定义时未定义

4 个答案: