单位换算问题

不好意思，是我描述不够清楚，需求是这样的：
input的值是只读的，从其它地方传过来的，操作是选择下拉框
           当下拉框选择公顷的时候，那么把input的值换算成公顷
   当选择亩的时候，把input的值换算成亩
   当选择平方米的时候，把input的值换算成平方米
   但是input的值可能是公顷、亩、平方米
   比如input的值是3(亩)那么当select下拉选择公顷的时候，就把这个3 亩转换为公顷，选择哪个选项就把3亩转换成哪个

那么如何能够知道转过来的这个只读的3是什么单位？
input的值可能是公顷、亩、平方米……这……

根据输入数据的三种可能的单位，输出三种结果
其实这跟楼主发的上一贴是一样的……
html里增加了一个显示结果的div    <select id="unit" onchange="selectChange(this)">
      <option value ="公顷">公顷</option>
      <option value ="亩">亩</option>
      <option value="平方米">平方米</option>
    </select></br></br></br></br></br>

    这个input的值可能是3公顷、3亩、3平方米</br>
    <input type="text" value="3" id="input0" readonly/>
<div id="rst"></div>js里改变了fRate数组元素的顺序，跟下拉框选项的顺序对应，以便取值    //根据选择的单位换算input的值[input的值可能是3公顷、3亩、3平方米]
    //1公顷 = 15亩 = 10000平米
    var fRate = [1,15,10000];
    function selectChange(obj){
var str = "";
var unit = document.getElementById("unit");
var oldValue = document.getElementById("input0").value;
for (var i=0; i<fRate.length; i++)
{
//源数据的单位有三种可能
if (i==0) str += oldValue + " 公顷 = ";
if (i==1) str += oldValue + " 亩 = ";
if (i==2) str += oldValue + " 平米 = "; var gq = parseFloat(oldValue)/fRate[i]; //先换算成公顷数
//如果源数据的单位和下拉框中的是一样的，那么不计算直接写上
if (i == unit.selectedIndex) str += oldValue +" " + unit.options[unit.selectedIndex].text +"<br>";
else str += gq*fRate[unit.selectedIndex] +" " + unit.options[unit.selectedIndex].text +"<br>";
}
document.getElementById("rst").innerHTML = str;
    }

你可以考虑如下的方式
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style></style>
<script>
//根据选择的单位换算input的值[input的值可能是3公顷、3亩、3平方米]
    //10000平米 = 15亩 = 1公顷
var opt=[{'key':'平方米','value':10000},{'key':'亩','value':15},{'key':'公顷','value':1}];
    function selectChange(obj){

    var oText=document.getElementById("input0");
        var oldValue = oText.value;
var iNum=oldValue.match(/\d+(\.\d+)?/g)[0];//得到原始数值
var cRule=oldValue.match(/[\u4e00-\u9fa5]+/g)[0];//得到原始单位
var sRule=obj.value;
        var sO= opt.searchObj(sRule);
var cO=opt.searchObj(cRule);
//计算比例
var rate=sO.value/cO.value;
//计算变换最终值
var result=(iNum*rate).toFixed(2);//假设保留2位小数
oText.value=oText.value.replace(iNum.toString(),result).replace(cRule,sO.key);


    }
Array.prototype.searchObj=function(key)
{
for(var i=0;i<this.length;i++)
{
if(this[i].key==key)
return this[i];
}
return null;
}

</script>
</head><body><select onchange="selectChange(this)">
      <option value ="公顷">公顷</option>
      <option value ="亩">亩</option>
      <option value="平方米">平方米</option>
    </select></br></br></br></br></br>

    这个input的值可能是3公顷、3亩、3平方米</br>
    <input type="text" value="3公顷" id="input0"/>
</body>
</html>

是这样的，我打开页面的时候会用一个变量a接收传过来一个值，var a = '传过来的值' (这个传过来的值可能是0、1、或者2)。
当传过来是0 (a == 0)的时候，input值得单位就是平米；当a==1时，input单位就是亩；a==2时，input单位是公顷
这样的话，该怎样改呢

是这样的，我打开页面的时候会用一个变量a接收传过来一个值，var a = '传过来的值' (这个传过来的值可能是0、1、或者2)。
当传过来是0 (a == 0)的时候，input值得单位就是平米；当a==1时，input单位就是亩；a==2时，input单位是公顷
我想通过传过的值来判断input的单位，这样如何改一下呢

    <select onchange="selectChange(this)" id="sel">
      <option value ="公顷">公顷</option>
      <option value ="亩">亩</option>
      <option value="平方米">平方米</option>
    </select><br /><br />

    这个input的值可能是3公顷、3亩、3平方米<br />
    <input type="text" value="3" id="input0"/>
      <script type="text/javascript">
          var a = parseInt('0');  /////这里改为你动态接受到的值
          var sel = document.getElementById('sel');
          sel.selectedIndex = 2 - a; /////设置单位下拉
          var lastUnit = document.getElementById('sel').value; //记录当前单位
          var input = document.getElementById("input0");
          var fRate = {
              公顷: { 亩: 15, 平方米: 10000 },
              亩: { 平方米: 10000 / 15, 公顷: 1 / 15 },
              平方米: { 亩: 15 / 10000, 公顷: 1 / 10000}
          };
          function selectChange(obj) {
              var v = parseFloat(input.value);
              var rst = (v * fRate[lastUnit][sel.value]).toFixed(4);//保留4位小数
              input.value = rst;
              lastUnit = sel.value;
          }
    </script>

楼主，这个真心简单。BTW，注意结贴率。例如：A = 10000平方米（传过来的值）
你分节能得到A_01 = parseFloat(A, 10)   //=> 10000
A_02 = A.replace(A_01, '') //=>平方米
A_03 = $('#下拉框ID').find('option:selected').val() //=> 下拉框选择的单位先验证数据有效性，我只写简单的一种情况
if (!A .length)
  return '值不能为空';
……………………
继续判断两边单位相等的情况
if (A_02 === A_03)
   return A;
再写一个选择器
var c = function() {
    return {
        '平方米' : function() {
             if (arguments[0] === '公顷') //处理平方米转公顷
                  return [10000 / arguments[1], arguments[0] ].join('');
             ………………
        },
        '公顷' : function() {
        }[arguments[0]]
    }
}
// 根据A_02来选择返回的方法
调用var v = c(A_02)(A_03, A_01);大概意思懂了吗，这样写便于扩展。
不懂请追问。

我这个rate是固定的，var fRate = [1,15,10000]; 这个不能变的

本帖最后由 showbo 于 2014-05-16 12:16:17 编辑

真的没有看懂
我希望是这样var a == ; //传过来的值：0或1或2
var fRate = [1,15,10000];
for(i = 0;i<fRate.length; i++){
if(a==i){
var r = fRate[i];

}
}

没有那么复杂，这样就可以<script type="text/javascript">
var a = 0; //初始的单位//根据选择的单位换算input的值[input的值可能是3公顷、3亩、3平方米]
// 1公顷 = 15亩 = 10000平米
var fRate = [1,15,10000];
function selectChange(obj){
  var o = document.getElementById("input0"); //输入框
  o.value = parseFloat(o.value) /fRate[a] * fRate[obj.value];
  a = obj.value;
}
</script>

<input type="text" value="3" id="input0"/>
<select onchange="selectChange(this)">
<option value ="0">公顷</option>
<option value ="1">亩</option>
<option value="2">平方米</option>
</select>

原始单位和目标单位都确定的话就不用循环了
就用之前的改改吧，懒得动脑子了，应该还有更简洁的办法的 <input type="text" value="3" id="input0" readonly/>
a= <select id="unit_old">
      <option value ="0">平方米</option>
      <option value ="1">亩</option>
      <option value="2">公顷</option>
    </select>
<BR><BR>
换算为 <select id="unit">
      <option value ="公顷">平方米</option>
      <option value ="亩">亩</option>
      <option value="平方米">公顷</option>
    </select>
<INPUT TYPE="button" VALUE="计算" ONCLICK="selectChange(this)">
</br></br></br></br>    <div id="rst"></div>
    //10000平米 = 15亩 = 1公顷
    var fRate = [10000,15,1];
    function selectChange(obj){
        var unit = document.getElementById("unit");
        var unit_o = document.getElementById("unit_old");
        var oldValue = document.getElementById("input0").value;        var str = "a="+unit_o.options[unit_o.selectedIndex].value +"<br>"+ oldValue + unit_o.options[unit_o.selectedIndex].text + " = ";
        var gq = parseFloat(oldValue)/fRate[unit_o.selectedIndex]; //先换算成公顷数
            //如果源数据的单位和下拉框中的是一样的，那么不计算直接写上
            if (unit_o.selectedIndex == unit.selectedIndex) str += oldValue +" " + unit.options[unit.selectedIndex].text +"<br>";
            else str += gq*fRate[unit.selectedIndex] +" " + unit.options[unit.selectedIndex].text;        document.getElementById("rst").innerHTML = str;
    }

没有写上我的思路，难怪楼主看不懂
我加一点注释① var A = '10000平方米'; //=> 这个是要比较的值，也就是希望进行单位换算的值
② 通过A这个值你能得到2个条件：即 var A_01 = parseFloat(A, 10)   //=> 这里是数字部分10000
     和 var A_02 = A.replace(A_01, '') //=>这里是单位部分（平方米）
     有了这2个条件你就能做任何事了。
③ var A_03 = $('#下拉框ID').find('option:selected').val() //=> 下拉框选择的单位（比如你选择下拉框的公顷，那么就是'公顷'）
④ 先验证数据有效性，我只写简单的一种情况
if (!A .length)
  return '用来转换的值不能为空';
……………………
⑤ 继续判断两边单位相等的情况
if (A_02 === A_03)  //=> A_02是你传过来的值截取的单位（'平方米'/'公顷'），A_03是你下拉框选择的转换后的单位，如果相等不需要转换，如果能做到如果相等，从下拉框中remove掉的话就更好
   return A;
⑥ 再写一个选择器
var c = function() {
    /// <summary>事件选择器</summary>
    return {
        '平方米' : function() {
             if (arguments[0] === '公顷') //处理平方米转公顷
                  return [10000 / arguments[1], arguments[0] ].join('');
             ………………
        },
        '公顷' : function() {
        }[arguments[0]]
    }
};根据A_02来选择返回的方法
调用事件选择器：
var v = c(A_02)(A_03, A_01);
第一个A_02，传入c()方法中，通过比对会返回相应的方法，比如你传入了'平方米'，那么就会返回'平方米' ： function(){}这个方法，你传入'公顷'，就会返回'公顷'  ： function() {}这个方法
c()()，你可以看成是先执行c()这个方法，再一个()表示执行通过c()这个方法返回的方法。
A_03和A_01是传入的返回的方法中的参数其实大家都写得很好，我也并不是推销自己的方法，只是我觉得这样条理会更清楚一些，更加便于扩展，如果要再增加一个单位的换算，只需要在事件选择器中增加一个对应的单位方法就可以了。
不懂请追问。

调试易

单位换算问题

解决方案 »