javascript验证数字和字符串的文本框

时间:2016-12-05 01:35:54

标签: javascript jquery netbeans-8

我需要一些关于这个javascript代码的帮助。我想验证Nights税箱和名称文本框,因此它们中包含值。 “夜间”文本框只能接受数字编号。

这是我的代码



$(document).ready(function() {
    
    var emailPattern = /\b[A-Za-z0-9._%+-]+@[A-Za-z0-9.-]+\.[A-Za-z]{2,4}\b/;
    //var numeric =  /^[0-9]+$/;
    var regex = /[0-9]|\./;
        
        $(":text, #error").after("<span>*</span>");
        $("arrival_date").focus();
        
    $(document).on("click", "#submit", function (e) {
        
        var valid = true;
        
        if ($("#name").val() === "") {
            $("#name").next().text("This field is required.").css({
                "color": "#FF0000",
                "font-size": "13px"
            });
            valid = false;
        }
        else {
            
            valid = true;
        }
        
        if ($("#nights").val() === "") {
            valid = false;
            $("#nights").next().text("This field is required.").css( {
                "color": "#FF0000",
                "font-size": "13px"
            });
        } else if (!regex.test("nights")) {
            $("#nights").next().text("This field is required.").css( {
                "color": "#FF0000",
                "font-size": "13px"
            });
            valid = false;
        }
        else {
            valid = true;
        }
ad
&#13;
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Reservation request</title>
	<link rel="stylesheet" href="main.css">
	<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
	<script src="http://code.jquery.com/jquery-latest.min.js"></script>
	<script src="reservation.js"></script>
</head>
	
<body>
	<h1>Reservation Request</h1>
	<form action="response.html" method="get"
    	name="reservation_form" id="reservation_form">
		<fieldset>
        	<legend>General Information</legend>
        	<label for="arrival_date">Arrival date:</label>
        	<input type="text" name="arrival_date" id="arrival_date" autofocus><br>
        	<label for="nights">Nights:</label>
        	<input type="text" name="nights" id="nights"><br>
        	<label>Adults:</label>
        	<select name="adults" id="adults">
        		<option value="1">1</option>
        		<option value="2">2</option>
        		<option value="3">3</option>
        		<option value="4">4</option>        		        		        		
        	</select><br>
        	<label>Children:</label>
        	<select name="children" id="children">
        		<option value="0">0</option>
        		<option value="1">1</option>
        		<option value="2">2</option>
        		<option value="3">3</option>
        		<option value="4">4</option>        		        		        		
        	</select><br>        	
		</fieldset>
		<fieldset>
        	<legend>Preferences</legend>
        	<label>Room type:</label>
			<input type="radio" name="room" id="standard" class="left" checked>Standard&nbsp;&nbsp;&nbsp;	        	
			<input type="radio" name="room" id="business" class="left">Business&nbsp;&nbsp;&nbsp;
			<input type="radio" name="room" id="suite" class="left last">Suite<br>
        	<label>Bed type:</label>
			<input type="radio" name="bed" id="king" class="left" checked>King&nbsp;&nbsp;&nbsp;
			<input type="radio" name="bed" id="double" class="left last">Double Double<br>
			<input type="checkbox" name="smoking" id="smoking">Smoking<br>
		</fieldset>		
		<fieldset>
    		<legend>Contact Information</legend>
    		<label for="name">Name:</label>
			<input type="text" name="name" id="name"><br>
        	<label for="email">Email:</label>
        	<input type="text" name="email" id="email"><br>
			<label for="phone">Phone:</label>
			<input type="text" name="phone" id="phone" placeholder="999-999-9999"><br>
		</fieldset>

		<input type="submit" id="submit" value="Submit Request"><br>

	</form>
</body>
</html>
&#13;
&#13;
&#13;

  

更新的代码。

$(document).ready(function() {

var emailPattern = /\b[A-Za-z0-9._%+-]+@[A-Za-z0-9.-]+\.[A-Za-z]{2,4}\b/;
//var numeric =  /^[0-9]+$/;
var regex = /[0-9]|\./;

    $(":text, #error").after("<span>*</span>");
    $("arrival_date").focus();


function isNumeric(n) {
    return !isNaN(parseFloat(n)) && isFinite(n);
} 
$(document).on("click", "#submit", function (e) {

    var valid = true;

    if ($("#name").val() === "") {
        $("#name").next().text("This field is required.").css({
            "color": "#FF0000",
            "font-size": "13px"
        });
        valid = false;
    }

    if ($("#nights").val() === "") {
        valid = false;
        $("#nights").next().text("This field is required.").css( {
            "color": "#FF0000",
            "font-size": "13px"
        });
    } else if (isNumeric("#nights")) {
        $("#nights").next().text("This field is required.").css( {
            "color": "#FF0000",
            "font-size": "13px"
        });
        valid = false;
    }

     if (valid === false)
         e.preventDefault();

});        });

我在跳,有人可以帮助我

0 个答案:

没有答案