html中表单输入框如何限制输入数字,并且在提交中会出现有提示(表单

html中表单输入框如何限制输入数字,并且在提交中会出现有提示(表单,第1张

js:
function btnck(){
var a=documentgetElementById("text");
var b=documentgetElementById("btn");
if(avalue==""){
alert("文本框内容不能为空!");}
else{
alert("提交成功!");}
}
html:
<input id="text" type="text" />
<input id="btn" type="button" onclick="btnck();" value="提交" />

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>正则 只能输入数字</title>
<meta name="Keywords" content="" />
<meta name="Description" content="" />
<link rel="stylesheet" href="css/css" />
</head>
<body>
<input type="text" id="txt" />
<button id="btn">确定</button>
<script>
var txt = documentgetElementById('txt')
var btn = documentgetElementById('btn')
var reg = /^\d$/
btnonclick = function(){
var val = txtvalue
if( !regtest(val)){
alert('只能输入数字!')
}
}
</script>
</body>
</html>

单纯HTML无法实现你要的功能,javascript也只能实现客户端的限制,要做到完全限制还是需要服务端的逻辑控制。我给一下js的实现吧
function checkInput(obj){
var _szText = objvalue;

if(!_szText) return;

for(var i=0;i<_szTextlength;i++)
{
if(_szTextcharCodeAt(i) > 128)
{
alert('只允许输入数字,字母,符号');
return;
}
}
}
然后你的HTML控件像这样:<input type='text' onchange='checkInput(this)' />
也就是加一下onchange事件的触发就可以了。

<html>
<body>
<form action="/example/html/form_actionasp" method="get">
<p>First name: <input type="text" name="fname" /></p>
<p>Last name: <input type="text" name="lname" /></p>
<input type="submit" value="Submit" />
</form>
<p>请单击确认按钮,输入会发送到服务器上名为 "form_actionasp" 的页面。</p>
</body>
</html>
用的是INPUT标签。
input标签后面的type是输入的类型
type="text"是文本输入框
type="submit"是提交按钮
他会被标记为一个类似于变量的结构
name后面就使用输入数值的时候的名字

<input type="text" id="ipt">
<button id="btn">生成</button>$(function(){ 
    var Country = ["中国","挪威","美国","瑞典","希腊","法国","英国","意大利","澳大利亚"] 
    $("#btn")click(function(){ 
            var text = $("#ipt")val() 
     for(var i=0 ;i<3;i++){ 
     var leng = Countrylength 
     var random = Mathround(Mathrandom()  (leng-1)); 
     var coun = Country[random] ;
     consolelog(text +","+ coun) 
     } 
    })
})


欢迎分享,转载请注明来源:内存溢出

原文地址: https://outofmemory.cn/yw/13345471.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-07-18
下一篇 2023-07-18

发表评论

登录后才能评论

评论列表(0条)

保存