从键盘输入时,“提交”按钮会刷新整个页面

时间:2015-10-28 04:48:20

标签: javascript html forms input form-submit

我有这个表单,我从用户那里得到输入并以相同的形式(在td内)将其插入表中,我用js做了。问题是每当我点击进入(使用鼠标)它工作正常,但当我使用键盘输入它刷新整个页面。代码有什么问题?,我怎样才能克服它?

<form action="">
   LOAN AMOUNT:<input type="text" name="amount" id="amount"/>
   <input type="button" value="Enter" id="enter"/>
   <div class="CSSTableGenerator">
      <table>
         <tr>
            <th></th>
            <td></td>
         </tr>
      </table>
   </div>
</form>

2 个答案:

答案 0 :(得分:1)

处理#define craigs_inline static inline

喜欢这个

onsubmit

答案 1 :(得分:1)

您正在使用输入类型按钮,因此点击事件可以正常工作,但是当您单击输入键而不是表单提交事件时,因为您的页面重新加载

您需要处理提交事件而不是点击事件

在你的html中进行以下更改

    <form action="" id="myform" >

   <input type="submit" value="Enter" id="enter"/>

跟随你的js

  $(document).ready(function() {
        $("#myform").submit(function() { // handle submit instead of click 
            var p = document.getElementById("amount").value;
            var interest = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
            var year = [5, 10, 15, 20, 25, 30];
            var r;
            var SI;
            var id;
            for (x = 0; x < interest.length; x++) {
                r = interest[x];
                id = x + 1;
                for (y = 0; y < year.length; y++) {
                    n = year[y];
                    SI = (p * n * r) / 100;

                    console.log(SI)
                    document.getElementById(n + "_year_" + id).innerHTML = SI;
                }
                console.log(p)
                console.log(r)
               document.getElementById("loan" + id).innerHTML = p;
                document.getElementById("interest" + id).innerHTML = r + "%";
            }
            return false;
        });
    });

工作fiddle

相关问题