更改组合框时,在输入框中插入数组项

insert an array item in the input box on changing the combo box

本文关键字:插入 数组 输入 组合      更新时间:2023-09-26

当combo1框的选择改变时,我想设置一个特定的数组项作为输入标签的值。

    <%@ page language="java" import="java.util.*;" pageEncoding="ISO-8859-1"%>
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
        <head>
        </head>
    <script language="javascript">
    function check()
        {
            if(!validate())
                return false;
        }
    function validate()
        {
            if (document.form.amount.value <=0)
            {
                alert ("Please enter valid loan amount.");
                return false;
            }
            else
                return true;
        }
        var arr = new Array();
        arr[0] = new Array("-select-", "10.0","10.5", "12.0");
        function change(combo1) {
            document.getElementById("rate").style.visibility = "visible";
            var sel = document.getElementById("combo1");
        var val = document.getElementById("rate").value;
        for(var i = 0, j = sel.options.length; i < j; ++i) {
            if(sel.options[i].innerHTML == val) {
               sel.selectedIndex = i;
               break;
            }
        }
    }
}
    </script>
        <jsp:include page="include.jsp"></jsp:include>
        <body>
            <br>
            <form action="PaymentServlet.do" name="form" method="post"
                ONSUBMIT="return check()">
                <fieldset>
                    <legend>
                        <font style="font-family: sans-serif" size="4px" color="Megenta">Online Loan
                            Application Page</font>
                    </legend>
                    <br />
                    Loan Type
                    <select name="combo1" onchange="change(this);">
                        <option value="0">
                            -Select-
                        </option>
                        <option value="1">
                            Home Loan
                        </option>
                        <option value="2">
                            Education Loan
                        </option>
                        <option value="3">
                            Car Loan
                        </option>
                    </select>
                    <br />
                    Interest Rate(%)<input type="text" name="rate" style="visibility: hidden;">
                    <br />
                    Loan Amount
                    <input type="text" name="loanamount" />
                    <br />
                    <input type="submit" name="go" value="o Go o" />
                </fieldset>
            </form>
        </body>
    </html>

根据贷款类型,我希望从数组中选择各自的利率,并希望将该数组项用作name="rate"的输入标记的值。

要获取组合框的值,您需要执行以下操作:

var val = sel.options[sel.selectedIndex].value;

sel是您的组合框

不能将name作为参数来使用document.getElementById("elementid")。参数必须是元素的id,而不是name。

实际上你不需要使用document。getElementById,因为您在更改函数中返回this作为参数。this是指实际的元素。

那么你的变化函数应该是这样的,

function change(combo1) {
       document.getElementById("rate").style.visibility = "visible";
       document.getElementById("rate").value = arr[combo1.selectedIndex];
}

你的数组定义也是错误的。右边的在这里,

var arr = new Array();
arr[0] = new Array("-select-", "10.0","10.5", "12.0");

var arr = new Array("-select-", "10.0","10.5", "12.0");

最后不要忘记为rate输入添加id属性,

<input type="text" id="rate" name="rate" style="visibility: hidden;">

这里是完整的代码和DEMO

<script language="javascript">
function check()
    {
        if(!validate())
            return false;
    }
function validate()
    {
        if (document.form.amount.value <=0)
        {
            alert ("Please enter valid loan amount.");
            return false;
        }
        else
            return true;
    }
    var arr = new Array("-select-", "10.0","10.5", "12.0");
    function change(combo1) {
        document.getElementById("rate").style.visibility = "visible";
       document.getElementById("rate").value = arr[combo1.selectedIndex];
}
</script>
    <body>
        <br>
        <form action="PaymentServlet.do" name="form" method="post"
            ONSUBMIT="return check()">
            <fieldset>
                <legend>
                    <font style="font-family: sans-serif" size="4px" color="Megenta">Online Loan
                        Application Page</font>
                </legend>
                <br />
                Loan Type
                <select name="combo1" onchange="change(this);">
                    <option value="0">
                        -Select-
                    </option>
                    <option value="1">
                        Home Loan
                    </option>
                    <option value="2">
                        Education Loan
                    </option>
                    <option value="3">
                        Car Loan
                    </option>
                </select>
                <br />
                Interest Rate(%)<input type="text" id="rate" name="rate" style="visibility: hidden;">
                <br />
                Loan Amount
                <input type="text" name="loanamount" />
                <br />
                <input type="submit" name="go" value="o Go o" />
            </fieldset>
        </form>
    </body>

如果您的数组定义为

arr[0] = new Array("-select-", "10.0","10.5", "12.0");
然后

function change(combo1) {
    document.getElementById("rate").style.visibility = "visible";
    var rate = document.getElementById("rate");
    rate.value = arr[0][combo1.selectedIndex];
}