仅在项目存在时定义变量

时间:2014-03-27 01:23:47

标签: javascript arrays

在这个网站上的几个人的帮助下,我能够获得以下脚本的变体,根据他们在下拉菜单中做出的选择来填充一些文本字段。基本上,他们从下拉列表中选择他们的位置,并使用他们的地址(input_19)和城市,州和邮政编码(input_21)填充文本字段。当将其扩展到多个用途时,我意识到有时候套件号需要在一个单独的字段中,所以我添加了两个额外的变量来分割地址(input_26)和套件号(input_21)。如果没有input_21,则表示脚本失败。有没有办法只在字段存在时才使用脚本部分?

// JavaScript Document

// Pre populated array of data
var myData1 = new Array();
myData1['Addison'] = '14295 Midway Road, Suite 100';
myData1['Arlington'] = '1241 W. Green Oaks Blvd., Suite 101';
myData1['Colleyville'] = '1210 Hall Johnson Road, Suite 150';
myData1['Fire Wheel'] = '650 Beebalm Lane, Suite 260';
myData1['Flower Mound'] = '3020 Corporate Court, Suite 400';
myData1['Fort Worth'] = '4421 Oak Park Lane, Suite 102';
myData1['Legacy'] = '7500 Dallas Pkwy., Suite 175';
myData1['Mansfield'] = '1405 N. Highway 287, Suite 101';
myData1['McDermott'] = '3915 McDermott Road, Suite 2000';
myData1['Preston Center'] = '8201 Preston Road, Suite 450';
var myData2 = new Array();
myData2['Addison'] = 'Addison, TX 75001';
myData2['Arlington'] = 'Arlington, TX 76013';
myData2['Colleyville'] = 'Colleyville, TX 76034';
myData2['Fire Wheel'] = 'Garland, TX 75040';
myData2['Flower Mound'] = 'Flower Mound, TX 75028';
myData2['Fort Worth'] = 'Fort Worth, TX 76109';
myData2['Legacy'] = 'Plano, TX 750241';
myData2['Mansfield'] = 'Mansfield, TX 76063';
myData2['McDermott'] = 'Plano, TX 75025';
myData2['Preston Center'] = 'Dallas, TX 75225';
var myData3 = new Array();
myData3['Addison'] = 'Suite 100';
myData3['Arlington'] = 'Suite 101';
myData3['Colleyville'] = 'Suite 150';
myData3['Fire Wheel'] = 'Suite 260';
myData3['Flower Mound'] = 'Suite 400';
myData3['Fort Worth'] = 'Suite 102';
myData3['Legacy'] = 'Suite 175';
myData3['Mansfield'] = 'Suite 101';
myData3['McDermott'] = 'Suite 2000';
myData3['Preston Center'] = 'Suite 450';
var myData4 = new Array();
myData4['Addison'] = '14295 Midway Road';
myData4['Arlington'] = '1241 W. Green Oaks Blvd.';
myData4['Colleyville'] = '1210 Hall Johnson Road';
myData4['Fire Wheel'] = '650 Beebalm Lane';
myData4['Flower Mound'] = '3020 Corporate Court';
myData4['Fort Worth'] = '4421 Oak Park Lane';
myData4['Legacy'] = '7500 Dallas Pkwy.';
myData4['Mansfield'] = '1405 N. Highway 287';
myData4['McDermott'] = '3915 McDermott Road';
myData4['Preston Center'] = '8201 Preston Road';




var element = document.querySelector('form.cart');
element.input_1.onchange = updateText;
function updateText() {
var obj_sel = element.input_1;
element.input_19.value = myData1[obj_sel.value];
var obj_sel = element.input_1;
element.input_21.value = myData2[obj_sel.value];
var obj_sel = element.input_1;
element.input_26.value = myData3[obj_sel.value];
var obj_sel = element.input_1;
element.input_31.value = myData4[obj_sel.value];
}

谢谢!

1 个答案:

答案 0 :(得分:0)

如果对象不存在,则脚本将抛出错误,因为您尝试将属性分配给undefined。由于您没有catch该错误,脚本将在此时停止运行。在尝试设置其值之前,可以使用if语句确认对象不是undefined。每次使用时也不需要重复var obj_sel = element.input_1;

function updateText() {
  var obj_sel_value = element.input_1.value;

  if(element.input_19)
    element.input_19.value = myData1[obj_sel_value];
  if(element.input_21)
    element.input_21.value = myData2[obj_sel_value];
  if(element.input_26)
    element.input_26.value = myData3[obj_sel_value];
  if(element.input_31)
    element.input_31.value = myData4[obj_sel_value];
}

这应该可以解决您的问题,但您可以采取其他措施来改善您的代码并节省自己的时间。例如,您可以使用一个对象数组,而不是为每个myData对象创建一个变量。如果您发现自己使用数字为变量名后缀,那么您应该考虑用一个数组替换所有这些变量。

var myData = [];
myData[0] = {};
myData[0]['Addison'] = '14295 Midway Road, Suite 100';
...
myData[0]['Preston Center'] = '8201 Preston Road, Suite 450';
myData[1]['Addison'] = 'Addison, TX 75001';
...
myData[1]['Preston Center'] = 'Dallas, TX 75225';
myData[2] = {};
...
...

另请注意,我已将new Array()来电替换为{}。这是有道理的,因为你像对象而不是数组一样使用它。 Javascript数组是一个有序集合,由数字键索引。如果您有字符串键,则使用的是对象,而不是数组。对象是(键,值)对的无序集合。