jQuery变量在定义时声称它是未定义的

Question

我正在尝试在同一页面上设置两个自动填充文本框，一个用于手机型号 - input1，另一个用于固件 - input2。当两者都填充时，我希望使用 ID input1input2 显示一个 div，但是当在 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

问题在于 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 这一行有两个问题，如果算上缺少的括号和分号，则有四个问题，但是...

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

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

Answer 2

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

var phone;
var phoneid;

随后省略var

phone = li.selectPhone;

Answer 3

它没有在findFirmware() 函数可访问的任何地方定义——它在findPhone() 中定义为var，因此是该函数的局部变量。

不确定li.selectFirmware 等内容的意图，但它们也会中断。

Answer 4

问题在于 id 中的. 字符。

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

Which characters are valid in CSS class names/selectors?