自己改了一点$.extend() 不知道为什么不好用

来源:4-8 使用$.extend()扩展工具函数

一家之煮

2017-02-08 15:10

<!DOCTYPE html>
<html>
    <head>
        <title>使用$.extend()扩展工具函数</title>
        <link href="style.css" rel="stylesheet" type="text/css" />
        <script src="http://www.imooc.com/data/jquery-1.8.2.min.js" type="text/javascript"></script>
    </head>
    
    <body>
        <div id="divtest">
            <div class="title">
                <span class="fl">自定义工具函数求两值中最小值</span> 
                <span class="fr">
                	<input type="text" id="num1" />
                	<input type="text" id="num2" />
                    <input id="btnShow" name="btnShow" type="button" value="计算" />
                </span>
            </div>
            <div class="content">
                <div class="tip"></div>
            </div>
        </div>
        
        <script type="text/javascript">
            /*------------------------------------------------------------/
            功能:返回两个数中最小值

            /------------------------------------------------------------*/
            (function ($) {
                $.extend({
                    "MinNum": function (p1, p2) {
                        return (p1 > p2) ? p2 : p1;
                    }
                });
            })(jQuery);
            $(function () {
                $("#btnShow").bind("click", function () {
                    $(".tip").html("");
                    var strTmp = "最小的数是:";
                    var num1=$('#num1').val();
                    var num2=$('#num2').val();
                    strTmp += $.MinNum(num1, num2);
                    //显示在页面中
                    $(".tip").show().append(strTmp);
                });
            });
        </script>
    </body>
</html>

显示的永远是num1的数  老哥们帮我看看哪里出问题了

写回答 关注

5回答

  • _嘟_
    2019-06-03 10:00:39

    var num1=$('#num1').val(); 

    var num2=$('#num2').val();

    num1,num2为字符串格式,要转换为数字才能正确比较。

    var num1=parseInt($('#num1').val());                  

    var num2=parseInt($('#num2').val()); 

  • solace_lee
    2018-06-18 23:05:13

    $(function () {
                    $("#btnShow").bind("click", function () {
                        $(".tip").html("");
                        var strTmp = "最小的数是:";
                        var num1=$('#num1').val()*1;
                        var num2=$('#num2').val()*1;
                        strTmp += $.MinNum(num1, num2);
                        //显示在页面中
                        $(".tip").show().append(strTmp);
                    });
                });

    判断错误的原因是num1,num2这样赋值的类型是字符串,加上*1运算转换为数字类型就可以了。

  • web_東
    2018-04-26 10:47:42
    <!DOCTYPE html>
    <html>
    <head lang="en">
        <meta charset="utf-8">
        <title>使用$.extend()扩展工具函数</title>
        <style type="text/css">
            #divtest{
                width:320px;
                margin:100px auto;
            }
            .tip{
                margin:10px 0;
                background-color:#00a5e7;
                display: none;
            }
    
    
        </style>
        <link href="style.css" rel="stylesheet" type="text/css" />
        <script src="https://www.imooc.com/data/jquery-1.8.2.min.js" type="text/javascript"></script>
    </head>
    
    <body>
    <div id="divtest">
        <div class="title">
            <span class="fl">自定义工具函数求两值中最小值</span><br/>
            <span class="fr">
                        <input type="text" id="num1" /><br/>
                        <input type="text" id="num2" />
                        <input id="btnShow" name="btnShow" type="button" value="计算" />
                    </span>
        </div>
        <div class="content">
            <div class="tip"></div>
        </div>
    </div>
    
    <script type="text/javascript">
        /*------------------------------------------------------------/
         功能:返回两个数中最小值
    
         /------------------------------------------------------------*/
     (function ($) {
            $.extend({
                "MinNum": function (p1, p2) {
                    return (p1 > p2) ? p2 : p1;
                }
            });
        })(jQuery);
        $(function () {
            $("#btnShow").bind("click", function () {
                $(".tip").html("");
                var strTmp = "最小的数是:";
                var num1=$('#num1').val();
                var num2=$('#num2').val();
                strTmp += $.MinNum(num1, num2);
                //显示在页面中
     $(".tip").show().append(strTmp);
            });
        });
    </script>
    </body>
    </html>

    输入值超过999就出现bug?

    solace... 回复Chai_陌...

    测试并没有这个限制,应该是你的代码有地方出问题了

    2018-06-18 23:07:29

    共 2 条回复 >

  • Mankii
    2017-08-04 14:06:21

    复制你的代码试了一下,是好的

    web_東

    有bug

    2018-04-26 10:46:45

    共 1 条回复 >

  • Secret_geek
    2017-02-20 00:02:17

    试了一下,明明是好的啊

jQuery基础(五)一Ajax应用与常用插件

如何用jquery实现ajax应用,加入学习,有效提高前端开发速度

69095 学习 · 400 问题

查看课程

相似问题