0

如果选择了该值，我想为该值添加 +10%，但在我可以实现它之前，我需要使其正常工作，页面的第一个不应该刷新，当我添加一个值然后我想改变它到另一个我希望从另一个文本框中减去旧值......我尝试了一个简单的 if/else if / else 语句，但由于第一个错误它不起作用，我什至不确定它是工作正常。这是代码：

<!doctype html>

<html>
<head>
    <title>lol</title>
    <meta charset="utf-8">

</head>
<body>
    <form action="">
        <input type="text" id="hp">
        <input type="text" id="ea">
        <input type="text" id="ed">
        <input type="text" id="pa">
        <input type="text" id="pd">
        <input type="text" id="sp">

        <select>
            <option value="hp">HP</option>
            <option value="ea">EA</option>
            <option value="ed">ED</option>
            <option value="pa">PA</option>
            <option value="pd">PD</option>
            <option value="sp">SP</option>
        </select>
        <input type="submit" id="sub" onClick = "return at()">
    </form>

    <script type="text/javascript">
        function at () {
            var a = document.form.select.options,
                i = document.form.select.selectedIndex,
                ea = Number(document.form.ea.value),
                ed = Number(document.form.ed.value),
                hp = Number(document.form.hp.value),
                pd = Number(document.form.pd.value),
                pa = Number(document.form.pa.value),
                sp = Number(document.form.sp.value),
                eaS,edS,pdS,paS,spS,hpS = 0;

            if(a[i].text === "hp"){
                hpS = hp*0.1;
            }else if(a[i].text === "ea"){
                eaS = ea*0.1
            }else if(a[i].text === "ed"){
                edS = ed*0.1
            }else if(a[i].text === "pa"){
                paS = pa*0.1
            }else if(a[i].text === "pd"){
                pdS = pd*0.1
            }else if(a[i].text === "sa"){
                spS = sp*0.1
            }

            document.form.ea.value = eaS;
            document.form.ed.value = edS;
            document.form.hp.value = hpS;
            document.form.pd.value = pdS;
            document.form.pa.value = paS;
            document.form.sp.value = spS;

            return false;
        }
    </script>
</body>
</html>
4

3 回答 3

1

查看 JavaScript 控制台

我愿意打赌它有类似的错误。如果您没有看到错误，请设置您的控制台，使其在页面导航中持续存在错误。

未捕获的类型错误：无法读取未定义的属性“选择”

您正在寻找一个名为 form 的元素和一个名为 select 的元素，但您的 form/select 没有名称。

<form action="">
<select>

应该

<form name="form" action="">
<select name="select">

理想情况下，您会删除 document.name.name 语法并使用 getElementById。在 select 和 form 上放置一个 id 并以这种方式引用输入。switch 语句也是你的朋友。

您的代码可以在没有 if 语句的情况下编写，只需使用基于选择值的查找。

function at() {
    var sel = document.getElementById("mySelect");
    var val = sel.options[sel.options.selectedIndex].value;
    var input = document.getElementById(val);
    if (input) {
         var val = input.value;
         resetValues();
         input.value = parseFloat(val) * .1;   
    }
}

function resetValues() {
    var inputs = document.getElementById("myForm").getElementsByTagName("input");
    for (var i=0;i<inputs.length;i++) {
        var inp = inputs[i];
        if (inp.type==="text") inp.value = 0;
    }
}

JSFiddle - 运行示例

于 2013-04-23T12:41:20.770 回答
0

需要很多改变：

<!doctype html>

<html>
<head>
    <title>lol</title>
    <meta charset="utf-8">

</head>
<body>
    <form action="">
        <input type="text" name="hp" id="hp">
        <input type="text" name="ea" id="ea">
        <input type="text" name="ed" id="ed">
        <input type="text" name="pa" id="pa">
        <input type="text" name="pd" id="pd">
        <input type="text" name="sp" id="sp">

        <select id="mySelect">
            <option value="hp">HP</option>
            <option value="ea">EA</option>
            <option value="ed">ED</option>
            <option value="pa">PA</option>
            <option value="pd">PD</option>
            <option value="sp">SP</option>
        </select>
        <input type="button" id="sub" value="Submit" onClick = "return at()">
    </form>

    <script type="text/javascript">
        function at () {
            var a = document.getElementById('mySelect').options,
                i = document.getElementById('mySelect').selectedIndex,
                ea = Number(document.forms[0].ea.value),
                ed = Number(document.forms[0].ed.value),
                hp = Number(document.forms[0].hp.value),
                pd = Number(document.forms[0].pd.value),
                pa = Number(document.forms[0].pa.value),
                sp = Number(document.forms[0].sp.value),
                eaS,edS,pdS,paS,spS,hpS = 0;

            if(a[i].text === "HP"){
                hpS = hp*0.1;
            }
            if(a[i].text === "EA"){
                eaS = ea*0.1
            }
            if(a[i].text === "ED"){
                edS = ed*0.1
            }
            if(a[i].text === "PA"){
                paS = pa*0.1
            }
            if(a[i].text === "PD"){
                pdS = pd*0.1
            }
            if(a[i].text === "SA"){
                spS = sp*0.1
            }

            document.forms[0].ea.value = eaS;
            document.forms[0].ed.value = edS;
            document.forms[0].hp.value = hpS;
            document.forms[0].pd.value = pdS;
            document.forms[0].pa.value = paS;
            document.forms[0].sp.value = spS;

            return false;
        }
    </script>
</body>
</html>
于 2013-04-23T12:44:52.360 回答
0

像这样的东西

<form action="">
    <input type="text" id="hp">
    <input type="text" id="ea">
    <input type="text" id="ed">
    <input type="text" id="pa">
    <input type="text" id="pd">
    <input type="text" id="sp">
    <select name="select">
        <option value="hp">HP</option>
        <option value="ea">EA</option>
        <option value="ed">ED</option>
        <option value="pa">PA</option>
        <option value="pd">PD</option>
        <option value="sp">SP</option>
    </select>
    <input type="button" id="sub" value="Submit">
</form>

var sub = document.getElementById("sub");

function at() {
    var a = document.forms[0].select.options,
        i = document.forms[0].select.selectedIndex,
        ea = Number(document.forms[0].ea.value),
        ed = Number(document.forms[0].ed.value),
        hp = Number(document.forms[0].hp.value),
        pd = Number(document.forms[0].pd.value),
        pa = Number(document.forms[0].pa.value),
        sp = Number(document.forms[0].sp.value),
        eaS, edS, pdS, paS, spS, hpS;

    eaS = edS = pdS = paS = spS = hpS = 0;

    if (a[i].text === "HP") {
        hpS = hp * 0.1;
    } else if (a[i].text === "EA") {
        eaS = ea * 0.1
    } else if (a[i].text === "ED") {
        edS = ed * 0.1
    } else if (a[i].text === "PA") {
        paS = pa * 0.1
    } else if (a[i].text === "PD") {
        pdS = pd * 0.1
    } else if (a[i].text === "SA") {
        spS = sp * 0.1
    }

    document.forms[0].ea.value = eaS;
    document.forms[0].ed.value = edS;
    document.forms[0].hp.value = hpS;
    document.forms[0].pd.value = pdS;
    document.forms[0].pa.value = paS;
    document.forms[0].sp.value = spS;

    return false;
}

sub.addEventListener("click", at, false);

ob jsfiddle

我没有解决您的代码可能遇到的所有问题，只是主要部分。您可以使用这个小提琴来解决您的其他问题。

于 2013-04-23T12:45:45.743 回答