0

我有一个网站,其中包含我居住地区某些县的特定内容。我想创建一个表单来帮助用户访问他们需要的特定页面。因为我不想要县的下拉列表。我希望用户输入邮政编码,然后选择一个县(如果该邮政编码中有重叠)。

我不确定这是否可能,但我正在尝试创建一个可以执行此操作的表单:

表格的第一部分:输入邮政编码的文本框,然后单击提交,然后显示隐藏以显示可用县的无线电组选项,根据他们选择的县,他们会被定向到特定的 URL。

我正在尝试基于我在Fiddle上看到的这段代码

这是我正在使用的(并且失败了)

<form  id="zip_form">
Zip Code: <input type="text" name="zipcode" id="id_zip_code"/><input type="submit"    
value="Submit"/>
</form>

<div id="id_div_one">Option County1, County2 or Other</div>

<div id="id_div_two">Option County3, County4 or Other</div>    

<div id="id_div_sorry">Please call our office for a quote</div>

jQuery:

$(function () {
var zipCode1 = ['11111', '22222', '33333'];
$('#id_div_one, #id_div_sorry').hide();

var zipCode2 = ['44444', '55555', '66666'];
$('#id_div_two, #id_div_sorry').hide();

$('#zip_form').submit(function () {
    $('#id_div_one, #id_div_two, #id_div_sorry').hide();
    if (jQuery.inArray($('#id_zip_code').val(), zipCode1) > -1) {
        $('#id_div_one').css('display', 'inline');
    }
    if (jQuery.inArray($('#id_zip_code').val(), zipCode2) > -1) {
            $('#id_div_two').css('display', 'inline');
    } else {
            $('#id_div_sorry').css('display', 'inline');
    }
        return false;
    });

});

看到它在行动中失败

这可能吗?

提前致谢

4

1 回答 1

1

是的,这是可能的,您的代码几乎可以工作。唯一的错误是,您覆盖了第 5 行中的 zipCodes 数组,因为两个 zipCode 变量具有相同的名称。

所以更改第二个邮政编码数组的名称,一切都会奏效。

var zipCodeOne = ['11111', '22222', '33333'];
$('#id_div_one, #id_div_sorry').hide();

var zipCodeTow = ['44444', '55555', '66666'];
$('#id_div_two, #id_div_sorry').hide();

有关进一步的改进,请参见:

http://jsfiddle.net/E2cMT/4/

于 2013-06-18T20:58:13.207 回答