{"id":32359,"date":"2024-11-25T08:49:29","date_gmt":"2024-11-25T00:49:29","guid":{"rendered":"https:\/\/fwq.ai\/blog\/32359\/"},"modified":"2024-11-25T08:49:29","modified_gmt":"2024-11-25T00:49:29","slug":"%e5%be%ae%e4%bf%a1%e5%b0%8f%e7%a8%8b%e5%ba%8f%e4%b8%adinput%e6%a0%87%e7%ad%be%e7%9a%84%e4%bd%bf%e7%94%a8%e6%96%b9%e6%b3%95%ef%bc%88%e9%99%84%e4%bb%a3%e7%a0%81%ef%bc%89","status":"publish","type":"post","link":"https:\/\/fwq.ai\/blog\/32359\/","title":{"rendered":"\u5fae\u4fe1\u5c0f\u7a0b\u5e8f\u4e2dinput\u6807\u7b7e\u7684\u4f7f\u7528\u65b9\u6cd5\uff08\u9644\u4ee3\u7801\uff09"},"content":{"rendered":"<p>\u672c\u7bc7\u6587\u7ae0\u7ed9\u5927\u5bb6\u5e26\u6765\u7684\u5185\u5bb9\u662f\u5173\u4e8e\u5fae\u4fe1\u5c0f\u7a0b\u5e8f\u4e2dinput\u6807\u7b7e\u7684\u4f7f\u7528\u65b9\u6cd5\uff08\u9644\u4ee3\u7801\uff09\uff0c\u6709\u4e00\u5b9a\u7684\u53c2\u8003\u4ef7\u503c\uff0c\u6709\u9700\u8981\u7684\u670b\u53cb\u53ef\u4ee5\u53c2\u8003\u4e00\u4e0b\uff0c\u5e0c\u671b\u5bf9\u4f60\u6709\u6240\u5e2e\u52a9\u3002<\/p>\n<p>\u5728\u5f00\u53d1\u8fc7\u7a0b\u4e2d\u7ecf\u5e38\u9047\u5230\u8fd9\u6837\u7684\u9700\u6c42\uff1a\u7528\u6237\u53ea\u80fd\u8f93\u5165\u6570\u5b57\u5e76\u4e14\u53ea\u4fdd\u7559\u5c0f\u6570\u70b9\u4e24\u4f4d\u3002\u867d\u7136\u6211\u4eec\u53ef\u4ee5\u5728\u63d0\u4ea4\u8868\u5355\u7684\u65f6\u5019\u8fdb\u884c\u9a8c\u8bc1\uff0c\u4f46\u662f\u4f53\u9a8c\u4e0d\u662f\u5f88\u597d\u3002\u4e0b\u9762\u6211\u4e3b\u8981\u4f7f\u7528\u4e86\u5c0f\u7a0b\u5e8finput\u6807\u7b7e\u7684bindinput\u65b9\u6cd5\u5bf9\u8f93\u5165\u7684\u503c\u8fdb\u884c\u76d1\u542c\uff0c\u7136\u540e\u8fdb\u884c\u6b63\u5219\u5339\u914d\u3002<\/p>\n<h3>1. input\u6807\u7b7e<\/h3>\n<p>\u5fae\u4fe1\u5c0f\u7a0b\u5e8finput\u6807\u7b7e\u81ea\u5e26type=digit\u5c5e\u6027\uff0c\u53ef\u4ee5\u8c03\u8d77\u5e26\u6709\u5c0f\u6570\u70b9\u7684\u6570\u5b57\u952e\u76d8\uff0cmaxlength\u5c5e\u6027\u53ef\u4ee5\u63a7\u5236\u6211\u4eec\u8f93\u5165\u5b57\u7b26\u7684\u4e2a\u6570\uff0c\u7136\u540e\u6211\u4eec\u7ed9input\u6807\u7b7e\u7ed1\u5b9abindinput\u65b9\u6cd5\u3002<\/p>\n<pre>&lt;input type=\"digit\" bindinput=\"regInput\" maxlength=\"15\"\/&gt;<\/pre>\n<p> \u767b\u5f55\u540e\u590d\u5236 <\/p>\n<h3>2. \u7ed1\u5b9a\u76d1\u542c\u4e8b\u4ef6<\/h3>\n<p>bindinput\u65b9\u6cd5\u53ef\u4ee5\u76d1\u542c\u5230\u5f53\u524d\u8f93\u5165\u6846\u7684\u503c\uff0c\u7c7b\u4f3c\u4e8eonchange\u4e8b\u4ef6\uff0c\u4f46\u4e0d\u592a\u4e00\u6837\u3002\u901a\u8fc7e.detail.value\u53ef\u4ee5\u83b7\u53d6\u5230input\u7684\u503c\uff0creturn\u8fd4\u56de\u7684\u5b57\u7b26\u4e32\u53ef\u4ee5\u66ff\u6362\u6389\u8f93\u5165\u7684\u5b57\u7b26\u4e32\u3002<\/p>\n<h3>3. \u6b63\u5219\u5339\u914d<\/h3>\n<p>\u5339\u914d\u6b63\u5219\u901a\u8fc7\u5219\u8fd4\u56de\u6240\u6709\u5b57\u7b26\uff0c\u4e0d\u901a\u8fc7\u5219\u53bb\u6389\u6700\u540e\u4e00\u4e2a\u4e0d\u5339\u914d\u7684\u5b57\u7b26\u8fd4\u56de\u3002<\/p>\n<pre>\/*\u6b63\u5219\u5339\u914d*\/\nregInput(e){\n    if(\/^(d?)+(.d{0,2})?$\/.test(e.detail.value)){\n        return e.detail.value;\n    }else {\n        return e.detail.value.substring(0,e.detail.value.length-1);\n    }\n}<\/pre>\n<p> \u767b\u5f55\u540e\u590d\u5236 <\/p>\n<p>\u76f8\u5173\u63a8\u8350\uff1a<\/p>\n<p><\/p>\n<\/p>\n<p>\u4ee5\u4e0a\u5c31\u662f\u5fae\u4fe1\u5c0f\u7a0b\u5e8f\u4e2dinput\u6807\u7b7e\u7684\u4f7f\u7528\u65b9\u6cd5\uff08\u9644\u4ee3\u7801\uff09\u7684\u8be6\u7ec6\u5185\u5bb9\uff0c\u66f4\u591a\u8bf7\u5173\u6ce8\u7c73\u4e91\u5176\u5b83\u76f8\u5173\u6587\u7ae0\uff01<\/p>\n","protected":false},"excerpt":{"rendered":"<p>\u672c\u7bc7\u6587\u7ae0\u7ed9\u5927\u5bb6\u5e26\u6765\u7684\u5185\u5bb9\u662f\u5173\u4e8e\u5fae\u4fe1\u5c0f\u7a0b\u5e8f\u4e2dinput\u6807\u7b7e\u7684\u4f7f\u7528\u65b9\u6cd5\uff08\u9644\u4ee3\u7801\uff09\uff0c\u6709\u4e00\u5b9a\u7684\u53c2\u8003\u4ef7\u503c\uff0c\u6709\u9700\u8981\u7684\u670b\u53cb\u53ef\u4ee5\u53c2\u8003\u4e00\u4e0b\uff0c\u5e0c\u671b\u5bf9\u4f60\u6709\u6240\u5e2e\u52a9\u3002 \u5728\u5f00\u53d1\u8fc7\u7a0b\u4e2d\u7ecf\u5e38\u9047\u5230\u8fd9\u6837\u7684\u9700\u6c42\uff1a\u7528\u6237\u53ea\u80fd\u8f93\u5165\u6570\u5b57\u5e76\u4e14\u53ea\u4fdd\u7559\u5c0f\u6570\u70b9\u4e24\u4f4d\u3002\u867d\u7136\u6211\u4eec\u53ef\u4ee5\u5728\u63d0\u4ea4\u8868\u5355\u7684\u65f6\u5019\u8fdb\u884c\u9a8c\u8bc1\uff0c\u4f46\u662f\u4f53\u9a8c\u4e0d\u662f\u5f88\u597d\u3002\u4e0b\u9762\u6211\u4e3b\u8981\u4f7f\u7528\u4e86\u5c0f\u7a0b\u5e8finput\u6807\u7b7e\u7684bindinput\u65b9\u6cd5\u5bf9\u8f93\u5165\u7684\u503c\u8fdb\u884c\u76d1\u542c\uff0c\u7136\u540e\u8fdb\u884c\u6b63\u5219\u5339\u914d\u3002 1. input\u6807\u7b7e \u5fae\u4fe1\u5c0f\u7a0b\u5e8finput\u6807\u7b7e\u81ea\u5e26type=digit\u5c5e\u6027\uff0c\u53ef\u4ee5\u8c03\u8d77\u5e26\u6709\u5c0f\u6570\u70b9\u7684\u6570\u5b57\u952e\u76d8\uff0cmaxlength\u5c5e\u6027\u53ef\u4ee5\u63a7\u5236\u6211\u4eec\u8f93\u5165\u5b57\u7b26\u7684\u4e2a\u6570\uff0c\u7136\u540e\u6211\u4eec\u7ed9input\u6807\u7b7e\u7ed1\u5b9abindinput\u65b9\u6cd5\u3002 &lt;input type=&#8221;digit&#8221; bindinput=&#8221;regInput&#8221; maxlength=&#8221;15&#8243;\/&gt; \u767b\u5f55\u540e\u590d\u5236 2. \u7ed1\u5b9a\u76d1\u542c\u4e8b\u4ef6 bindinput\u65b9\u6cd5\u53ef\u4ee5\u76d1\u542c\u5230\u5f53\u524d\u8f93\u5165\u6846\u7684\u503c\uff0c\u7c7b\u4f3c\u4e8eonchange\u4e8b\u4ef6\uff0c\u4f46\u4e0d\u592a\u4e00\u6837\u3002\u901a\u8fc7e.detail.value\u53ef\u4ee5\u83b7\u53d6\u5230input\u7684\u503c\uff0creturn\u8fd4\u56de\u7684\u5b57\u7b26\u4e32\u53ef\u4ee5\u66ff\u6362\u6389\u8f93\u5165\u7684\u5b57\u7b26\u4e32\u3002 3. \u6b63\u5219\u5339\u914d \u5339\u914d\u6b63\u5219\u901a\u8fc7\u5219\u8fd4\u56de\u6240\u6709\u5b57\u7b26\uff0c\u4e0d\u901a\u8fc7\u5219\u53bb\u6389\u6700\u540e\u4e00\u4e2a\u4e0d\u5339\u914d\u7684\u5b57\u7b26\u8fd4\u56de\u3002 \/*\u6b63\u5219\u5339\u914d*\/ regInput(e){ if(\/^(d?)+(.d{0,2})?$\/.test(e.detail.value)){ return e.detail.value; }else { return e.detail.value.substring(0,e.detail.value.length-1); } } \u767b\u5f55\u540e\u590d\u5236 \u76f8\u5173\u63a8\u8350\uff1a \u4ee5\u4e0a\u5c31\u662f\u5fae\u4fe1\u5c0f\u7a0b\u5e8f\u4e2dinput\u6807\u7b7e\u7684\u4f7f\u7528\u65b9\u6cd5\uff08\u9644\u4ee3\u7801\uff09\u7684\u8be6\u7ec6\u5185\u5bb9\uff0c\u66f4\u591a\u8bf7\u5173\u6ce8\u7c73\u4e91\u5176\u5b83\u76f8\u5173\u6587\u7ae0\uff01<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[19],"tags":[],"class_list":["post-32359","post","type-post","status-publish","format-standard","hentry","category-19"],"_links":{"self":[{"href":"https:\/\/fwq.ai\/blog\/wp-json\/wp\/v2\/posts\/32359","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/fwq.ai\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/fwq.ai\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/fwq.ai\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/fwq.ai\/blog\/wp-json\/wp\/v2\/comments?post=32359"}],"version-history":[{"count":0,"href":"https:\/\/fwq.ai\/blog\/wp-json\/wp\/v2\/posts\/32359\/revisions"}],"wp:attachment":[{"href":"https:\/\/fwq.ai\/blog\/wp-json\/wp\/v2\/media?parent=32359"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/fwq.ai\/blog\/wp-json\/wp\/v2\/categories?post=32359"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/fwq.ai\/blog\/wp-json\/wp\/v2\/tags?post=32359"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}