问答详情
源自：4-8 使用$.extend()扩展工具函数

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

<!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的数  老哥们帮我看看哪里出问题了

提问者：一家之煮 2017-02-08 15:10

个回答

  • _嘟_
    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()); 

    0
  • 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运算转换为数字类型就可以了。

    0
  • 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？

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

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

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

    试了一下，明明是好的啊

    0