js驗證小數或者數字

来源:https://www.cnblogs.com/ccx-10544/archive/2019/09/26/11591918.html
-Advertisement-
Play Games

利用正則表達式匹配是否為數字,直接上demo ...


利用正則表達式匹配是否為數字,直接上demo

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>checkNumber</title>
</head>

<body style="background-color: aliceblue;">
    <div id="main" style="margin: 0 auto; text-align: center; ">
        <form method="POST" action=""
            style="width: 50% ; height: 50%; text-align: center;margin: 0 auto;  padding-top: 20%;">
            <label>請輸入判斷的數字:</label><input type="text" id="amount" name="amount"
                onblur="checkAmount('amount','hint')" /><br />
            <p><span name="hint" id="hint" style="color: red"></span></p>
        </form>
    </div>
</body>
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script type="text/javascript">
    $(function () {
        //設置div高度
        $("#main").css("height", $(document).height);
        $("#main").css("width", $(document).width);
    });

    function notIntOrDecimal(text) {
        //校驗(小數/數字)正則表達式
        let pattern = /^[0-9]+([.]{1}[0-9]+){0,1}$/;
        if (pattern.test(text)) {
            return false;
        } else {
            return true;
        }
    }

    function checkAmount(objName, hintName) {
        let judgeVal = $("#" + objName).val();
        if (judgeVal !== '' && notIntOrDecimal(judgeVal)) {
            $("#" + hintName).html("請輸入一個整數或小數!");
            $("#" + objName).focus();
        } else {
            $("#" + hintName).html("校驗成功!");
        }
    }
</script>

</html>

 


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • InheritedWidget是Flutter中非常重要的一個功能型組件,它提供了一種數據在widget樹中從上到下傳遞、共用的方式,比如我們在應用的根widget中通過InheritedWidget共用了一個數據,那麼我們便可以在任意子widget中來獲取該共用的數據。 ...
  • 垃圾分類小助手-生活的好幫手的技術支持,如果您使用中出現什麼問題或者對我們產品有什麼改進建議,請隨時與我聯繫。 電話:15990075212 郵箱:[email protected] 應用簡介 垃圾分類小助手-生活的好幫手能夠快速搜索垃圾分類,高效率識別垃圾分類,輕鬆解決垃圾分類難題 ...
  • XPath匹配標簽使用text()判斷獲取結果失敗/為空的問題及解決方法 ...
  • html平時常見的塊元素有:div, p, h1, h2, h3等,內聯元素有:span, a, img等。 塊元素的屬性:無論內容是什麼,都會獨占一整行。主要用於頁面佈局。 內聯元素的屬性:只占自身大小的元素,不會占用一行。主要用於選中文本設置樣式。 div塊元素僅僅只用於進行頁面佈局,它自身不帶 ...
  • 頁面echarts.js報錯:Uncaught TypeError: Cannot read property 'getAttribute' of null ...
  • 修改wxParse/html2json.js 文件 ,在 html2json(html, bindName) 方法里 這裡使用 node.tag 能夠獲取標簽類型,比如: img、embed、video 這裡我的系統後臺編輯器使用的是ckeditor 上傳視頻。生成的便簽是:embed 所以加上判斷 ...
  • Vue 的 父傳子 子傳父 一、父組件向子組件傳值: 父傳子 把需要的數據 傳遞給 子組件,以數據綁定(v-bind)的形式,傳遞到子組件內部,供子組件使用 縮寫是(:) 1.創建子組件,在src/components/文件夾下新建一個Child.vue 子組件 2.Child.vue的中創建pro ...
  • 啥是HTML5?官方說HTML5 是下一代的 HTML... 本文主要介紹HTML5三個方面的知識,繼續往下看看吧。 語義化標簽 canvas&svg 響應式meta 一、語義化標簽 語義化標簽的優點: 比<div>標簽有更加豐富的含義,方便開發與維護 方便搜索引擎能識別頁面結構,有利於SEO 方便 ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發(一):使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說,近來想嘗試開發一款安卓APP,考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP,畢竟是使用Visual Studio開發工具,使用起來也比較的順手,結合微軟官方的教程進行了安卓 ...
  • 前言 QuestPDF 是一個開源 .NET 庫,用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫,它徹底改變了我們生成 PDF 文檔的方 ...
  • 項目地址 項目後端地址: https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址: ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址: http://tree ...
  • 話不多說,直接開乾 一.下載 1.官方鏈接下載: https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe,運行開始下載SQL server; 二. ...
  • 前言 隨著物聯網(IoT)技術的迅猛發展,MQTT(消息隊列遙測傳輸)協議憑藉其輕量級和高效性,已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫,為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog支持多種接收器用於日誌存儲,增強器用於添加屬性,LogContext管理動態屬性,支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項,適用於不同需求。 ...
  • 目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據,爬取信息時需要模擬瀏覽器行為,否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下: 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • 1.前言 什麼是熱更新 游戲或者軟體更新時,無需重新下載客戶端進行安裝,而是在應用程式啟動的情況下,在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR,Xlua,ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles,Addressable, ...
  • 本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺,其實像阿裡雲,騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後,它會送 ...
  • 通過以下方式可以高效,並保證數據同步的可靠性 1.API設計 使用RESTful設計,確保API端點明確,並使用適當的HTTP方法(如POST用於創建,PUT用於更新)。 設計清晰的請求和響應模型,以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證,確保接收到的數據符合預期格 ...