二维数组帮助输出值

我有一个表单，用户可以根据它们的位置将托盘运送到固定成本。目前这是英国和法国。对于每个国家，他们被分成4个区域。二维数组帮助输出值

因此，我们有这样的一个表：

enter image description here

我想做到这一点的最好办法是创建一个二维数组像这样莫名其妙：那么理想

var values = array[ 
     [1][1] = 20, 
     [1][2] = 25, 
     [1][3] = 35, 
     [1][4] = 40, 

     [2][1] = 36, 
     [2][2] = 42, 
     [2][3] = 50, 
     [2][4] = 56, 

     [3][1] = 42, 
     [3][2] = 56, 
     [3][3] = 52, 
     [3][4] = 68, 

     [4][1] = 60, 
     [4][2] = 70, 
     [4][3] = 68, 
     [4][4] = 72, 
    ]

如果用户选择英国区1（单选按钮），则选择法国区3（单选按钮），输出值将为35.

形式：

<form id="uk_zones"> 
    <div><input type="radio" name="uk_zone1" value="1">UK zone 1</div> 
    <div><input type="radio" name="uk_zone2" value="2">UK zone 2</div> 
    <div><input type="radio" name="uk_zone3" value="3">UK zone 3</div> 
    <div><input type="radio" name="uk_zone4" value="4">UK zone 4</div> 
</form> 

<br /> 


<form id="fr_zones"> 
    <div><input type="radio" name="fr_zone1" value="1">France zone 1</div> 
    <div><input type="radio" name="fr_zone2" value="2">France zone 2</div> 
    <div><input type="radio" name="fr_zone3" value="3">France zone 3</div> 
    <div><input type="radio" name="fr_zone4" value="4">France zone 4</div> 
</form>

我遇到的问题是如何将其输出到用户？使用二维数组是否正确？或者我完全走错了方向？

的jsfiddle：

http://jsfiddle.net/barrycorrigan/ZXHbq/

来源

2013-12-12 Barry Corrigan

你会想你的数组定义更改为以下：

var values = [[20,25,35,40],[36,42,50,56],[42,56,52,68],[60,70,68,72]];

这句法的2维数组（也是数组的数组）。

你还需要确保所有组中的单选按钮具有相同的name，在这种情况下uk_zone和fr_zone

一旦你做到了这一点，你需要记住，数组的索引是0以诚为本，所以您应该在单选按钮更改值设置为0到3，或者你可以抓住的值，并把它应用到你的阵列来获取正确的值之前1减：

var ukValue = document.querySelector('input[name="uk_zone"]:checked').value; 
var frValue = document.querySelector('input[name="fr_zone"]:checked').value; 

if(ukValue && frValue) 
{ 
    alert(values[ukValue-1][frValue-1]); 
}

你可以将上面的代码放在一个名为updateValue的函数中，然后设置th在该onChange监听你的每一个形式：

<form id="uk_zones" onChange="updateValue();"> 
    <div><input type="radio" name="uk_zone" value="1">UK zone 1</div> 
    <div><input type="radio" name="uk_zone" value="2">UK zone 2</div> 
    <div><input type="radio" name="uk_zone" value="3">UK zone 3</div> 
    <div><input type="radio" name="uk_zone" value="4">UK zone 4</div> 
</form> 

<br /> 


<form id="fr_zones" onChange="updateValue();"> 
    <div><input type="radio" name="fr_zone" value="1">France zone 1</div> 
    <div><input type="radio" name="fr_zone" value="2">France zone 2</div> 
    <div><input type="radio" name="fr_zone" value="3">France zone 3</div> 
    <div><input type="radio" name="fr_zone" value="4">France zone 4</div> 
</form>

来源

2013-12-12 15:31:39 Marcela

非常好，谢谢你现在正在处理警报，但我得到这个错误 - 未捕获TypeError：无法读取任何想法的属性'值'？ –

你确定你命名了所有的单选按钮'uk_zone'或'fr_zone'吗？如果不是，那就可以解释这个问题。 – Marcela

知道它没有添加一个，在数组的末尾。如果我在哪里取出警报功能，只是让它填充文本框会很容易做...谢谢你的所有帮助 –

你要在一个正确的方式，但你需要为你打算将它们分组，以便无线电buttun的第一组变得像单选按钮给予相同的名称这

在这里输入的代码

<form id="uk_zones"> 
    <div><input type="radio" name="uk_zone1" value="1">UK zone 1</div>`<br />` 
    <div><input type="radio" name="uk_zone1" value="2">UK zone 2</div>`<br />` 
    <div><input type="radio" name="uk_zone1" value="3">UK zone 3</div>`<br />` 
    <div><input type="radio" name="uk_zone1" value="4">UK zone 4</div>`<br />` 
</form>

同样，你必须莫迪第二个。

，并显示来自阵列值在JavaScript中使用此代码

var index1 = document.querySelector('input[name="uk_zone1"]:checked').value; 
var index2 = document.querySelector('input[name="fr_zone1"]:checked').value; 
array[index1][index2]

来源

2013-12-12 15:23:39 kiranbhat

很酷的感谢，唯一的事情是我真的很新的JavaScript。我挣扎了一下。如何使用您的代码将此显示给用户。 –

我在想一个禁用的文本字段。但不知道如何使用你的例子做到这一点。 –

使用这个JavaScript

function didplay() { 
    var index1 = document.querySelector('input[name="uk_zone1"]:checked').value; 
    var index2 = document.querySelector('input[name="fr_zone1"]:checked').value; 
    document.getElementById("text1").style.visibility = "visible"; 
    document.getElementById("text1").value = array[index1][index2] 
}

包括身体标记

<input type="text" id="text1" style="visibility:hidden" />

中的文本框，当用户点击调用此方法按钮

来源

2013-12-12 15:42:28 kiranbhat

二维数组帮助输出值

回答

相关问题