【问题标题】:External javascript-not working外部 javascript - 不工作
【发布时间】:2014-09-12 12:53:47
【问题描述】:

我在使用外部 java 脚本时遇到问题。由于表单验证效果不佳,我犯了一些错误。当 java 脚本代码在内部时,它做得很好。当我将它放在外部文件中时,它什么也不做。这是代码。

html

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Data management system</title>
    <script type="text/javascript" src="myscript.js" ></script>
</head>
<body>
 <div class="main">
     <div class="header"></div>
     <div class="continer">
         <div class="myForm1" style="height:200px; width:300px; float:left;">
            <h2>MTC</h2>
            <form name="myForm1" action="access.jsp" method="get" onsubmit="return validateMtc()">
                <br/>MSISDN:<input type="text" name="MISDN" maxlength="11">
                <br/>RECIEPIENT:<input type="text" name="recipient" maxlength="12">
                <br/>DONOR:<input type="text" name="donor" maxlength="10">
                <br/>Date:<input type="text" name="date" value="">
                <br/>RN#:<input type="text" name="rn" value="" maxlength="5">
                <br/>Issue:<input type="text" name="Issue" maxlength="13">
                <br/>SR:<input type="text" name="SR" maxlength="14">

                <br/><input type="submit" value="Submit">
                <br/><input type="reset" name="Reset">


            </form>


        </div>
        <div class="myform2" style="float:left; height:200px; width:300px;">
            <h2>O.C.S</h2>

        </div> 
        <div class="myform3" style="float:left; height:200px; width:300px;">
            <h2>K.B.C</h2>

        </div>

     </div>
 </div>



</body>

myscript.js

//alert(1);
var numbers = /^[0-9]+$/;
var Datee=/^[0-9-]*$/ig;///^\d{1, 2}\/\d{1, 2}\/\d{4}$/;    
var alpha_Numeric=/^[a-zA-Z0-9]*$/ig;
var alpha=/^[A-Za-z]+$/;
var a = document.forms["myForm1"]["MISDN"].value;
var b = document.forms["myForm1"]["Issue"].value;
var c = document.forms["myForm1"]["SR"].value;
var d = document.forms["myForm1"]["date"].value;
var e = document.forms["myForm1"]["recipient"].value;
var f = document.forms["myForm1"]["donor"].value;
var g = document.forms["myForm1"]["rn"].value;
var h = document.forms["myForm2"]["MISDN"].value;
var i = document.forms["myForm2"]["SR"].value;
var j = document.forms["myForm2"]["reason"].value;
var k = document.forms["myForm3"]["MSISDN"].value;
var l = document.forms["myForm3"]["SR"].value;
function validateMtc()
{


if(a == "" || b == "" || c == "" || d == "")
{          
    alert("Manadotry fields should not left blank");
    document.myForm1.MISDN.focus();
    document.myForm1.Issue.focus();
    document.myForm1.SR.focus();
    document.myForm1.date.focus();
    return false;
}
else if(!a.match(numbers))
{
    alert('Please input numeric characters only in MSISDN field');  
    document.myForm1.MISDN.focus();
    return false;
}
else if(!(b.match(alpha_numeric)))   
{  
    alert('Please input numeric and alphabets only in ISSUE field');  
    document.myForm1.Issue.focus();
    return false;
}  
else if(!c.match(numbers))  
{
    alert('Please input numeric characters only SR field');  
    document.myForm1.SR.focus();
    return false;
}
else if(!d.match(Datee))
{
    alert('Please input correct date in DATE field (dd-mm-yy)');  
    document.myForm1.date.focus();
    return false;
}
else if(!e.match(alpha))
{
    alert('Please input aplhabets only in reciepeint filed');  
    document.myForm1.recipient.focus();
    return false;

}
else if(!f.match(alpha))
{
    alert('Please input aplhabets only in donor field');  
    document.myForm1.donor.focus();
    return false;

}
else if(!g.match(alpha_Numeric))
{
    alert('Please input aplhabets and numerics only in RN# field');  
    document.myForm1.rn.focus();
    return false;

}
else
    return true;
//alert("!!!!!!!!");
}
function validate_ocs()
{
if(h == "" || i == "" || j == "")
{  
    alert("Manadotry fields should not left blank");
    document.myForm1.MISDN.focus();
    document.myForm1.Issue.focus();
    document.myForm1.SR.focus();
    document.myForm1.date.focus();
    return false;
}
else if(!h.match(numbers))
{
    alert('Please input numeric characters only in MSISDN field');  
    document.myForm2.MISDN.focus();
    return false;
}
else if(!i.match(numbers))  
{
    alert('Please input numeric characters only SR field');  
    document.myForm2.SR.focus();
    return false;
}
else if(!(j.match(alpha_numeric)))   
{  
    alert('Please input numeric and alphabets only in ISSUE field');  
    document.myForm2.Issue.focus();
    return false;
}  
else
    return true;

}
function validate_kbc()
{
if(k == "" || l == "")
{  
    alert("Manadotry fields should not left blank");
    document.myForm1.MISDN.focus();
    document.myForm1.SR.focus();

    return false;
}
else if(!k.match(numbers))
{
    alert('Please input numeric characters only in MSISDN field');  
    document.myForm3.MISDN.focus();
    return false;
}
else if(!l.match(numbers))  
{
    alert('Please input numeric characters only in SR field');  
    document.myForm3.SR.focus();
    return false;
}
else
    return true;

}
//alert('!!!');

【问题讨论】:

  • 如果可以选择使用 3rd 方库,何不试试出色的 JQuery Validation 插件jqueryvalidation.org
  • @ChaoticNadirs 要求是在 JS 中做!

标签: java javascript jsp validation


【解决方案1】:

如果您删除 document.alert("!!") 或仅用 alert("!!!") 替换它,它实际上似乎可以工作

function validateMtc()
{
//document.alert("!!!!!!!!");

字母数字的正则表达式:

/^[a-zA-Z0-9]*$/ig

数字和破折号的正则表达式:

/^[0-9\-]*$/ig

【讨论】:

  • 关于验证的事情。如果出现错误,它将跳过...请尝试将 document.alert("!") 替换为 alert("!") - 如果脚本完全加载,它应该显示。然后将警报移到代码中以查看失败的位置。它在这里工作正常
  • 为了好玩 - 发出警报(1);作为函数之前的第一行,因此它将在加载文档时显示,而不是在提交时显示。让您知道脚本已加载
  • 检查这个:codepen.io/anon/pen/myDxA 注意,我只在前两个上放了 fixedwidth 类来说明这一点
  • 你好@Steen 我的 js 代码再次无法正常工作:/。我在同一个 js 文件中添加了几个函数。并将 alert(1) 放在脚本的开头。它在加载脚本时提醒我。我应该编辑我的问题并再次粘贴 js 代码吗?
  • Stackoverflow 对“讨论”发出警告...... :-) 但是那个警报(1)并一次将它移到你的代码中一行。当它不起作用时,您之前就会遇到错误。或者编辑之前的 codepen 并进行更改以玩弄
猜你喜欢
  • 2017-09-19
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2017-06-22
  • 2019-09-05
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多