0

在此页面的底部，您将看到“在此处输入 EFC”的输入框。

顾问工具箱

JS 文件在这里... JavaScript 文件

输入 EFC 分数时（出于测试目的，使用 0 到 600 之间的任何数字），我希望用户能够选择其中一个按钮，因为可能有两个可能的值，具体取决于所选的按钮。

我想为一个按钮编写一个脚本，为另一个按钮编写另一个脚本。这是我在 HTML 中的代码...

<form onsubmit="showpell_12_13(this.efc.value); return false;">
                    <form onsubmit="showpell_13_14(this.efc2.value); return false;">
    <div align="center"><strong><em>EFC Calculator:</em></strong></p><br />

                        <div align="center"><input type="text" name="efc" placeholder="Enter EFC Here" value="Enter EFC here..." onblur="if(this.value == ''){ this.value = 'Enter EFC here...'; this.style.color = '#ebebeb';}" onfocus="if(this.value == 'Enter EFC here...'){ this.value = ''; this.style.color = '#000';}" style="color:#000000;" title="EFC Calculator" maxlength="5"/>
  </div><br />
        <!--placeholder="Enter EFC Here" serves as placeholder for all browsers. Does not work for IE9 or below, hence the included JS, which allows placeholder in IE8-->

        <input type="submit" value="EFC - 12 / 13" style="margin-bottom: 10px; width: 40%;" />

        <input type="submit" value="EFC - 13 / 14" style="margin-bottom: 10px; width: 40%;" /><br />

        <input type="reset" value="Reset" style="margin-bottom: 10px; width: 31%;"/>

            </form>

这是我创建的 JS 文件的示例...

function showpell_12_13(efc) {


  var pell;
  var ssg;
  var estpay;
  var monthpay;

    if (efc == 0) {
        pell = 5550;
        ssg = 0;
        estpay = -483;
        monthpay = 0;
    }

    else if (efc <= 100) {
        pell = 5500;
        ssg = 0;
        estpay = -433;
        monthpay = 0;
    }

    else if (efc < 200) {
        pell = 5400;
        ssg = 0;
        estpay = -333;
        monthpay = 0;
    }

    else if (efc < 300) {
        pell = 5300;        
        ssg = 0;
        estpay = -233;
        monthpay = 0;
    }

    else if (efc < 400) {
        pell = 5200;        
        ssg = 0;
        estpay = -133;
        monthpay = 0;
    }

    else if (efc < 500) {
        pell = 5100;        
        ssg = 0;
        estpay = -33;
        monthpay = 0;
    }

    else if (efc < 600) {
        pell = 5000;        
        ssg = 67;
        estpay = 0;
        monthpay = 0;
    } 

 confirm('Based on the 2012-2013 EFC you entered ('+efc+'), you may receive...'
                +' \n.........................................................'
                +' \n-Potential PELL Grant Award: $'+pell+'.'
                +' \n.........................................................'
                +' \n-Potential Student Success Grant: $'+ssg+'.'
                +' \n.........................................................'
    +' \n-Tuition of 36 credits: $14,472' 
                +' \n.........................................................'
    +' \n-Direct Loan maximum for a Freshman* student: $9,405**' 
                +' \n.........................................................'
    +' \n-Your estimated total payment: $'+estpay+'.'
                +' \n.........................................................'
    +' \n-Your estimated monthly payment: $'+monthpay+'.'
                +' \n.........................................................'
    +' \n *Note: This is only configured for 1st year undergraduate students.'  
    +' \n **Loan fees of 1% are included in the loan rates listed on this sheet.');


}

我为另一个按钮所做的是复制相同的脚本并创建第二个“.js”文件，然后将变量从“efc”更改为“efc2”。但它没有用。

我希望我的解释足够清楚。如果您需要更多信息，请与我们联系。

这是一个可能有帮助的jsfiddle 。但是，它不会允许您在 jsfiddle 中提交表单......

4

2 回答 2

0

首先不要嵌套表单，因为它无效。您可以在此处找到更多信息W3 规格。此外，如果您不打算将值提交到服务器，则根本不需要表单元素。

如果您只需要通过单击按钮来运行一些客户端逻辑，只需添加类似的单击事件

<input type="button" onclick="showpell_12_13(this.value)" value="EFC - 12 / 13" style="margin-bottom: 10px; width: 40%;" />
<input type="button" onclick="showpell_13_14(this.value)" value="EFC - 13 / 14" style="margin-bottom: 10px; width: 40%;" />

请将输入类型更改为按钮，因为您只需要运行 JavaScript 代码。这不是最好的方法，但它需要对您的代码进行最少的更改。事实上，您最好使用 JQuery 来订阅事件。

希望能帮助到你！

于 2013-06-10T18:38:10.630 回答
0

如果您只是要显示一个确认框，则根本不需要表格。我做了一个新的小提琴向你展示你可以做到的方法。您的代码中没有第二个按钮的函数，所以我只使用了第一个函数 showpell_12_13 中的值。

小提琴有所有的代码，但基本上，我会切换到 JQuery 点击处理程序，然后调用一个函数/根据点击的按钮传递不同的函数值。

http://jsfiddle.net/LJg6n/6/

$(function () {
    $('#efc_12_13_button').click(function () {
        var efc = $('#efc_value').val();

        var displayVals = setValuesForDisplay(efc);
        displayConfirmationBox(efc, displayVals.pell, displayVals.ssg, displayVals.estpay, displayVals.monthpay, "2012-2013");
    });

    $('#efc_13_14_button').click(function () {
        var efc = $('#efc_value').val();

        var displayVals = setValuesForDisplay(efc);
        displayConfirmationBox(efc, displayVals.pell, displayVals.ssg, displayVals.estpay, displayVals.monthpay, "2013-2014");
    });

    $('#reset_efc').click(function () {
        $('#efc_value').val('');
    });
});
于 2013-06-10T18:40:34.370 回答