Javascript无法从输入中获取值

时间:2017-02-27 16:54:34

标签: javascript html forms

我试图通过JavaScript从表单中的输入中获取值。但每当我点击提交时,我要么一无所获,0或未定义。大多数未定义。它似乎没有任何价值。

这是代码

<form id="ecoCalculator">
        <div class="form-group">
            <label for="k0">Start Kapital</label>
            <input type="number" name="k0" class="form-control" id="k0">
        </div>

        <div class="form-group">
            <label for="kn">Slut Kapital</label>
            <input type="number" name="kn" class="form-control" id="kn">
        </div>

        <div class="form-group">
            <label for="x">Rente</label>
            <input type="number" name="x" class="form-control" id="x">
        </div>

        <div class="form-group">
            <label for="n">Terminer</label>
            <input type="number" name="n" class="form-control" id="n">
        </div>

        <div class="ecoButtons">
            <input type="button" value="Udregn" class="btn btn-default" onclick="k0Eco()">
            <input type="reset" value="Ryd" class="btn btn-default">
        </div>

    </form>

    <div class="ecoResult">
        <p id="ecoResult">Resultat</p>
    </div>

</div>

<script type="text/javascript">
        // Public Variables
        var k0 = document.getElementById('k0').value();
        var kn = document.getElementById('kn').value();
        var x = document.getElementById('x').value();
        var n = document.getElementById('n').value();

        // Calculation of Initial Capital
        function k0Eco() {
            // Calculation
            var k0Value = kn / (1 + x) ^ n;
            // Show Result
            document.getElementById("ecoResult").innerHTML = k0;
        }

我已经查看了不同的问题但尚未找到解决方法。

我试图改变输入的名称,让功能只显示一个值,但仍然没有结果。

由于

3 个答案:

答案 0 :(得分:1)

值不是一个函数,它是一个属性。变化

var k0 = document.getElementById('k0').value()

var k0 = document.getElementById('k0').value

您的脚本也会在页面加载时运行,因此尚未填充任何内容。您需要将整个事物放在提交处理程序中:

document.getElementById('ecoCalculator').addEventListener('submit', function(e) {
    e.preventDefault();
    // your code here

});

现在从按钮中删除内联js并将其设置为submit:

<input type="submit" value="Udregn" class="btn btn-default" />

删除js中的功能

var k0 = document.getElementById('k0').value;
var kn = document.getElementById('kn').value;
var x = document.getElementById('x').value;
var n = document.getElementById('n').value;

// Calculation
var k0Value = kn / (1 + x) ^ n;
// Show Result
document.getElementById("ecoResult").innerHTML = k0Value;

Here's a working fiddle

答案 1 :(得分:0)

你需要在int中解析输入值。例如。

// Public Variables
    var k0 = parseInt(document.getElementById('k0').value);
    var kn = parseInt(document.getElementById('kn').value);
    var x = parseIntdocument.getElementById('x').value);
    var n = parseIntdocument.getElementById('n').value);

答案 2 :(得分:0)

  • 使用value代替value()。这是一个不是功能的属性。

  • 将变量放在函数中。页面加载变量时 正在获得投入的价值,那里什么都没有。

function k0Eco() {
    var k0 = document.getElementById('k0').value;
    var kn = document.getElementById('kn').value;
    var x = document.getElementById('x').value;
    var n = document.getElementById('n').value;

    var k0Value = kn / (1 + x) ^ n;

    document.getElementById("ecoResult").innerHTML = k0Value;
}
  • 将javascript代码放在<head>标记内或至少在按钮之前。当您尝试触发onclick()事件时,您的功能尚未创建。