Question

我做了一点点计算，将KG换成KG中的磅和磅并写入输入。但是，我想只用一个按钮来制作这个！理解？

KG to POUNDS - ＆gt; KG * 2.2046

POUNDS到KG - ＆gt; POUNDS / 2.2046

示例1：

田地1:50公斤

...计算值...

字段2（结果）：110.23磅

然后会有一个按钮让我更改功能（谷歌翻译按钮以改变每次点击的语言）我点击并... ..

示例2：

田地1：100磅

...计算值...

字段2（结果）：45.35

你能理解我的所作所为吗？

scss/**/*.scss

Answer 1

听起来你需要使用innerHtml。一些基本的伪逻辑：

var a = document.getElementById("one").innerHtml;
var b = document.getElementById("two").innerHtml;

document.getElementById("one").innerHtml = b;
document.getElementById("two").innerHtml = a;

Answer 2

我认为您正在寻找的只是一个简单的变量来跟踪＆＃34;模式＆＃34;你在。我已经为你建立了一个例子，看看它是如何工作的（我使用bootstrap让它变得漂亮，但显然是可选的）：

https://jsfiddle.net/DTcHh/13851/

<强> HTML

<div class="container">
    <div class="row">
        <div class="col-xs-6">
            Input: 
            <input id="inputNum" class="form-control" type="number"></input>
        </div>

        <div class="col-xs-6">
            Output: 
            <input id="outputNum" class="form-control" type="text" disabled></input>
        </div>
    </div>

    <span id="modeText">lbs to kg</span>
    <button id="switch" class="btn pull-right">Switch</button> 
</div>

<强>的Javascript

//0 = lbs to kg, 1 = kg to lbs
var mode = 0;

var inputNum = $("#inputNum");
var outputNum = $("#outputNum");
var switchMode = $("#switch");
var modeText = $("#modeText");

var calculateKgs = function() {
    outputNum.val(inputNum.val()/2.2046);
};

var calculateLbs = function() {
    outputNum.val(inputNum.val()*2.2046);
};

var calculate = function() {
    if(mode == 0)
        calculateKgs();
    else
        calculateLbs();
};

inputNum.change(calculate);
inputNum.keyup(calculate);

switchMode.click(function() {
    if(mode) {
        mode = 0;
        modeText.text("lbs to kg");
    }
    else {
        mode = 1;
        modeText.text("kg to lbs");
    }

    calculate();
});

如何制作开关按钮/反向按钮。与谷歌翻译类似

2 个答案: