easyUI中textbox或number的数值大小校验

最新推荐文章于 2022-07-22 17:51:46 发布

转载最新推荐文章于 2022-07-22 17:51:46 发布 · 754 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/fanxijiang/p/8287127.html

文章标签：

#javascript #ViewUI

本文介绍了一种使用EasyUI库实现的HTML页面方案，该方案通过两个Textbox控件接收用户输入的数值，并确保这些数值在-10到10之间。此外，还实现了对这两个数值的比较逻辑，确保第一个数值始终大于第二个数值。若输入不符合要求，将显示警告并清除输入。

例：textbox里面，要求做两个textbox名字为（A,B），其中两个的数字大小范围是-10~10之间，之后其中A的值必须大于B所填的数字，如果输入错误，则提示出弹出框，并清空数据。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>textbox&numberbox</title>
    <link rel="stylesheet" href="../EasyUI/themes/default/easyui.css">
    <link rel="stylesheet" href="../EasyUI/themes/icon.css">
    <script src="../EasyUI/jquery.min.js"></script>
    <script src="../EasyUI/jquery.easyui.min.js"></script>
</head>
<body>
<!--textbox的校验-->
    <input type="text" id="A"><br>
    <input type="text" id="B"/>
<script type="text/javascript">
    $(function () {
        $("#A").textbox({
            onChange:function(newValue){
                if(newValue<-10||newValue>10){
                    $.messager.alert('警报','请输入-10~10之间的数');
                    $("#A").textbox('clear')
                }else if(newValue==""||$("#B").textbox('getValue')==""){
                }else {
                    var a=$("#A").textbox('getValue');
                    var b=$("#B").textbox('getValue');
                    if(a>b){
                    }else {
                        $.message.alert('警报','输入的第一个数必须大于第二个数');
                        $("#A").textbox('clear')
                    }
                }
            }
        });
        $("#B").textbox({
            onChange:function(newValue){
                if(newValue<-10||newValue>10){
                    $.messager.alert('警报','请输入-10~10之间的数');
                    $("#B").textbox('clear')
                }else if(newValue==""||$("#A").textbox('getValue')==""){
                }else {
                    var a=$("#A").textbox('getValue');
                    var b=$("#B").textbox('getValue');
                    if(a>b){
                    }else {
                        $.messager.alert('警报','输入的第一个数必须大于第二个数');
                        $("#B").textbox('clear')
                    }
                }
            }
        });
    });