html js 计算器 小程序 过滤非数字

最新推荐文章于 2024-09-12 18:02:32 发布
最新推荐文章于 2024-09-12 18:02:32 发布
阅读量239 收藏
点赞数
文章标签： html js 计算器 小程序
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/y271623981/article/details/51236147
版权

（暂不支持小数）




<!DOCTYPE html> 
<html lang="zh-cn" author="csdn_cloudyc"> 
    <meta name="content-type" content="text/html; charset=utf-8"> 
<head> 
<title>Calculator</title> 
<!--将按键内容以字符串形式存储在文字框中当按钮为“=”时，调用eval方法计算结果然后将结果输出文字框中--> 
<script type="text/javascript"> 
    var numresult; 
    var str; 
    function onClickNum(num) { 
        str = document.getElementById("nunmsg"); 
        str.value = str.value + num; 
    } 
    function onClickClear() { 
        str = document.getElementById("nunmsg"); 
        str.value = ""; 
    } 
    function onClickResult() { 
        str = document.getElementById("nunmsg"); 
        numresult = eval(str.value); 
        str.value = numresult;
    }
    function onNoneNumber(in_value) {
        var rule = /^\d+$/;
        if (!rule.test(in_value)) {
            alert('Please input numeric!');
            this.value = in_value.replace(0, in_value.Length - 1);
         
        }
    }
</script> 
</head> 
<body bgcolor="#EEEEEE" > 
    <div align="center" style="font-size:40px;" >Calculator</div>
    <!--定义按键--> 
    <table border="1" align="center" bgcolor="#DDD" style="height:350px; width:270px"> 
        <tr> 
            <td colspan="4"> 
            <input type="text" id="nunmsg"  style="height:90px; width:100%  ; font-size: 50px" 
            οnkeyup="var rule = /^\d+$/; if(!rule.test(this.value)) {this.value=this.value.replace(/[^\d]+/g,'');}"
            <!--οnkeyup="onNoneNumber(this.value)-->"/> 
            </td> 
        </tr> 
        <tr>    
             <td> 
                 <input type="button" value="1" id="1" οnclick="onClickNum(1)" style="height: 70px; width: 90px; font-size: 35px"> 
            </td> 
            <td> 
                <input type="button" value="2" id="2" οnclick="onClickNum(2)"  style="height: 70px; width: 90px; font-size: 35px"> 
            </td> 
            <td> 
                <input type="button" value="3" id="3" οnclick="onClickNum(3)"  style="height: 70px; width: 90px; font-size: 35px"> 
            </td> 
            <td> 
                <input type="button" value="+" id="add" οnclick="onClickNum('+')" style="height: 70px; width: 90px; font-size: 35px"> 
            </td> 
        </tr> 
        <tr> 
            <td> 
                <input type="button" value="4" id="4" οnclick="onClickNum(4)"  style="height: 70px; width: 90px; font-size: 35px"> 
            </td> 
            <td> 
                <input type="button" value="5" id="5" οnclick="onClickNum(5)"  style="height: 70px; width: 90px; font-size: 35px"> 
            </td> 
            <td> 
                <input type="button" value="6" id="6" οnclick="onClickNum(6)" style="height: 70px; width: 90px; font-size: 35px"> 
            </td> 
            <td> 
                <input type="button" value="-" id="sub" οnclick="onClickNum('-')" style="height: 70px; width: 90px; font-size: 35px"> 
            </td> 
        </tr> 
    <tr> 
        <td> 
            <input type="button" value="7" id="7" οnclick="onClickNum(7)" style="height: 70px; width: 90px; font-size: 35px"> 
        </td> 
        <td> 
            <input type="button" value="8" id="8" οnclick="onClickNum(8)" style="height: 70px; width: 90px; font-size: 35px"> 
        </td> 
        <td> 
            <input type="button" value="9" id="9" οnclick="onClickNum(9)" style="height: 70px; width: 90px; font-size: 35px"> 
        </td> 
        <td> 
            <input type="button" value="×" id="mul" οnclick="onClickNum('*')" style="height: 70px; width: 90px; font-size: 35px"> 
        </td> 
    </tr> 
    <tr> 
        <td colspan="2"> 
            <input type="button" value="0" id="0" οnclick="onClickNum(0)" style="height: 70px; width: 190px; font-size: 35px"> 
        </td> 
        <td> 
            <input type="button" value="." id="point" οnclick="onClickNum('.')" style="height: 70px; width: 90px; font-size: 35px"> 
        </td> 
        <td> 
            <input type="button" value="/" id="division" οnclick="onClickNum('/')" style="height: 70px; width: 90px; font-size: 35px"> 
        </td> 
    </tr> 
    <tr> 
        <td colspan="2"> 
            <input type="button" value="Clear" id="clear" οnclick="onClickClear()" style="height: 70px; width: 190px; font-size: 35px" /> 
        </td> 
        <td colspan="2"> 
            <input type="button" value="=" id="result" οnclick="onClickResult()" style="height: 70px; width: 190px; font-size: 35px" /> 
        </td> 


    </tr> 


    </table> 
</body> 
</html> 

csdn_cloudyc
关注
房贷计算器微信小程序原生语言
Linlietao0587的博客
02-29 1658
微信小程序房贷计算器
HTML网页之计算器代码
weixin_30918633的博客
07-04 573
计算器网页效果显示：点击这里！ <script> function show(){ var date = new Date(); //日期对象 var now = ""; now = date.getFullYear()+"年"; //读英文即可了 now = now + (date.getMonth()+1)+"月"; //取月的时候取的...
js 去掉字符串中的非数字
热门推荐
徐同保的专栏
02-08 1万+
&lt;!DOCTYPE html&gt; &lt;html lang="en"&gt; &lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;js 去掉字符串中的非数字&lt;/title&gt; &lt;st
js 输入替换非数字
crawler
04-15 508
onkeyup="this.value=this.value.replace(/[\D]/g,'');" onkeydown="if(event.keyCode == '13') return doGo();"
小程序：使用正则表达式去除字符串中的非数字元素
zhyzh134的博客
02-28 3449
/**  * 使用正则表达式去除字符串中的非数字元素  *使用替换方法  */ public class NumberPattern { public static void main(String[] args) { String result=replace("2010-5-24 10:53:30"); System.out.println(result); } //
如何使用 JavaScript 构建计算器应用程序
allway2的博客
11-01 1121
这个史诗般的教程通过描述如何使用该语言开发一个简单的计算器应用程序，为 JavaScript 新手提供了一个可靠的练习。 面向初学者的 javascript 项目（8 部分系列） 1构建你的第一个 JavaScript 应用程序——一个随机报价生成器 2如何使用 JavaScript 构建维基百科搜索应用程序 3如何使用 JavaScript 构建计算器应用程序 4如何使用 JavaScript 构建待办事项列表应用程序 5如何使用 JavaScript 构建自定义 HTML5 视频播...
mysql加php前后台联动计算器小程序_微信小程序搜索功能！附：小程序前端+PHP后端...
weixin_39593744的博客
01-28 277
开发需求微信小程序已经是非常火了，而且学习也比较容易，但是对于初学者来说还是一件比较伤脑筋的事，接下来给大家分享一下小程序搜索的思路。流程1、表单(输入框、提交按钮、提交的name值)2、接收表单数据(js获取表单name=keyword的值)3、通过wx.request向服务器后端发起请求查询数据库4、返回JSON格式的数据给小程序，js解析渲染到小程序前端展示界面代码index.wxml小程序...
微信小程序开发（1）
shaozheng0503的博客
06-16 1340
小程序是一种全新的连接用户与服务的方式，它可以在微信内被便捷地获取和传播，同时具有出色的使用体验。除了前端开发，JavaScript还可以用于后端开发，例如使用Node.js技术进行服务器端编程。同时，JavaScript也是一门学习曲线较为平缓的语言，让初学者能够快速入门，并逐渐深入掌握。
微信小程序内容接入安全检测接口
DayDayUp
04-08 1万+
最近微信小程序代码审核不通过，原因是未将用户的头像和网名做内容接入安全，根据修改指引： 一、什么服务或功能的小程序是UGC小程序？ 小程序中的功能或服务中，涉及用户将自己自定义编辑的文字、图片、音频、视频等内容通过小程序进行展示或提供给其他用户的，属于UGC小程序。 二、作为UGC小程序，用户发布的内容与小程序是否相关？ 微信小程序的服务提供者应当负有监管责任，应设置过滤违法、违规等不当...
基于AngularJS实现iOS8自带的计算器
10-21
AngularJS是一种流行的JavaScript框架，由Google维护，它主要用于构建Web应用程序的动态视图。AngularJS通过使用HTML作为模板语言以及扩展HTML标签来绑定数据，使得开发者能够更加轻松地实现常见的动态网页功能。...
MD5计算器_多页面浏览器_源代码
08-18
MD5计算器是一款用于计算字符串或文件哈希值的工具，而多页面浏览器则是一种能够同时打开和管理多个网页的程序。这两个概念结合在同一个源代码中，表明这是一份实现这两种功能集成的软件开发资源。 在系统结构方面...
程序天下:JavaScript实例自学手册
07-08
3.43 JavaScript过滤SQL注入字符 3.44 textarea内实现行的翻页效果 3.45 textarea中的文本插入 3.46 查找两段文本中相同的词句 3.47 自动保存网页输出的文本 3.48 文本编辑器 第4章 鼠标特效 4.1 禁用鼠标右键 4.2 ...
富文本中去掉 HTML 和 CSS 样式，只保留纯文本
S筱潇S四维Smile
09-11 395
要从富文本中去掉 HTML 和 CSS 样式，只保留纯文本，可以使用以下几种方法：1. 纯 JavaScript 方法你可以使用 JavaScript 的innerText或来提取文本，而忽略 HTML 标签和样式。
水平垂直居中的几种方法（总结）
致未来的你。的博客
09-11 1233
水平垂直居中的几种方法（总结）
XWiki中添加 html 二次编辑失效
galoiszhou的博客
09-12 291
使用 XWiki 中的 HTML 宏：如果标准的 Markdown 语法和 XWiki 的链接语法都无法工作，可以考虑使用 HTML 宏，它可以让你在 XWiki 页面中插入纯 HTML 代码，而不会被自动转换回 Markdown。如果直接在 XWiki 中添加 html, 例如 修改颜色, 新窗口打开主页面等功能, 首次保存是生效的. 如果再次编辑, 则失效, 原因是被转换成了 Markdown 的代码, 而 Markdown 不支持.解决这个问题可以使用 HTML 宏.
HTML + CSS - 网页布局之一般布局&浮动布局
qq_51222843的博客
09-11 1197
讲解CSS中的一般布局以及浮动布局
html 中如何使用 uniapp 的部分方法
weixin_59685936的博客
09-11 343
好了，现在就可以 uni. 使用相关的方法了。
Openlayers 报错记录 Failed to execute ‘toDataURL‘ on ‘HTMLCanvasElement‘:
最新发布
Liszter
09-12 457
原因是引用的图层得配置跨域问题。这是浏览器对canvas 设置的导出安全策略。每个引用的图层添加一个。即可、、、 不用谢、、
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值