JavaScript Jquery 作业问题只适用于变量的最佳值

标签 javascript jquery html

我拍摄这个有一段时间了,我完全不明白为什么这个程序不能正常工作。我正在学习 JavaScript 入门类(class),所以我确信我可能错过了一些明显的东西,但我们将不胜感激任何帮助。

这是javascript/jquery

 $(document).ready(function(){

    $("#form1").validate({
        rules: {
            salary: "required",
            creditScore: "required",
            months: "required"

        },
        messages: {
            salary:"salary is required",
            creditScore:"credit score is required",
            months: " months is required"
        }

    });

    $("#form1").submit(function(){

    });  

    $('#verify').click(function() {
        'use strict'
        var form = $("#form1");
        form.validate();

        if (form.valid()) {
            var salary = $("#salary").val();

            var creditScore = $("#creditScore").val();

            var months = $("#months").val();

            var result;
            console.log (salary);
            console.log (creditScore);
            console.log (months);
            if ( salary >= 40000 ) 
            {
                if(creditScore >= 600 || months > 12)
                {
                    result = "Loan approved";
                }
            } 
            else if (salary  < 40000 ) 
            {
                if (creditScore >= 600 && months > 12)
                {
                    result = "Loan approved.";
                }
            }
            else 
            {
                result = "Loan denied.";
            }

            console.log(result);
            $('#output').val(result);

            return false;
            }

    });
});

这是html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script src="jquery.validate.js"></script>
<script src="LoanProcess.js"></script>
<body>
<form id="form1" name="form1" method="post" action="">
  <p>
    <label for="salary">salary: </label>
    <input type="text" name="salary" id="salary">
  </p>
  <p>
    <label for="creditScore">creditScore: </label>
    <input type="text" name="creditScore" id="creditScore">
  </p>
    <p>
    <label for="months">months: </label>
    <input type="text" name="months" id="months">
  </p>
  <p>
    <input type="submit" name="verify" id="verify" value="Verify">
  </p>  
  <p>
    <input type="text" name="output" id="output" value="">
  </p>  

</form>
<div id="result">
</div>
</body>
</html>
</body>
</html>

最佳答案

注意事项:

  • 你的脚本标签在 head 标签之外,在 body 之前 - 它们必须在一个或另一个里面

  • body 和 html 标签都关闭了两次

  • 如果你想使用 'use strict' 通常你把它放在模块的第一行,即使把它放在函数里面是完全合法的,但它不对你的情况很有意义

  • 如果您的表单不需要提交处理程序,请将其删除

  • jquery 的良好做法是缓存您将多次使用的选择器:

  • $().val() 返回字符串,因此您必须先将其转换为数字,在与数字比较之前,使用 parseIntparseFloat+xx | 0 或适合您情况的其他方法

  • 你必须添加load denied消息以防外部条件成立但内部条件不成立

考虑例子:

$(function() {
  var form = $('#form')
    , $salary = $("#salary")
    , $creditScore = $("#creditScore")
    , $months = $("#months")
    , verify = $('#verify')

  form.validate(...)

  verify.on('click', function(e) {

     form.validate()

     if (form.valid()) {

        // I belive you are waiting for integers more than a zero
        // so using `x | 0`  you are getting 0 or integer
        var salary = $salary.val() | 0
          , creditScore = $creditScore.val() | 0
          , months = $months.val() | 0
        // now you have numbers so your comparison would number with number not string with string
        ...

     }


  })

})

还要感谢@Tieson T,有一个 fiddle ,它似乎在做你想做的事http://jsfiddle.net/A4Rg3/2/

关于JavaScript Jquery 作业问题只适用于变量的最佳值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22737954/

相关文章:

javascript - 代码镜像 - 使给定行完全变灰

javascript - 正确使用ajax成功吗?

jQuery Cycle 插件无法在模态框内工作(简单模态插件)

html - 为什么 flexbox justify-content 使我的 'block' 按钮内联?

php - 如何在 anchor 标记中调用php变量

javascript - 这行 javascript 的作用是什么?

javascript - 从外部vue获取Vue组件的数据

jquery - 从 jquery 调用 MVC 操作并处理重定向或返回的部分 View

HTML - 如何使 <p> 中的文本垂直居中

javascript - 如何将 Date 对象转换为仅输出 hh :mm am/pm