一家之煮
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的数 老哥们帮我看看哪里出问题了
var num1=$('#num1').val();
var num2=$('#num2').val();
num1,num2为字符串格式,要转换为数字才能正确比较。
var num1=parseInt($('#num1').val());
var num2=parseInt($('#num2').val());
$(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运算转换为数字类型就可以了。
<!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?
复制你的代码试了一下,是好的
试了一下,明明是好的啊
jQuery基础(五)一Ajax应用与常用插件
69100 学习 · 400 问题
相似问题