一页网页中与JavaScript有关的多种形式

我想在同一页面上有两种形式，一种用于用户注册，一种用于编辑逗号名称。到目前为止，这就是我的方法...

test001.js：


$(document).ready(function() {
    $(function() {
        $("#dialog").dialog({
            autoOpen: false
        });
        $("#button").on("click",function() {
            $("#dialog").dialog("open");
        });
    });
    // Validating Form Fields.....
    $("#submit").click(function(e) {
    var email = $("#email").val();
    var comnpanyname = $("#companyname").val();
    var lastname = $("#lastname").val();
    var password = $("#password").val();
    var emailReg = /^(([^<>()\[\]\.,;:\s@\"]+(\.[^<>()\[\]\.,;:\s@\"]+)*)|(\".+\"))@(([^<>()[\]\.,;:\s@\"]+\.)+[^<>()[\]\.,;:\s@\"]{2,})$/i;
    if (firstname === '' || lastname === '' || password === '' || email === '') {
        alert("Please fill all fields!");
        e.preventDefault();
    } else if (!(email).match(emailReg)) {
        alert("Invalid Email!");
        e.preventDefault();
    } else {
        alert("Form Submitted Successfully.");
    }
});
});

test001.css

@import "http://fonts.googleapis.com/css?family=Droid+Serif";
/* Above line is used for online google font */
h2 {
text-align:center;
font-size:24px
}
hr {
margin-bottom:30px
}
p {
color:#000;
font-size:16px;
font-weight:700
}
#button,#button2 {
border:1px solid #0c799e;
width:250px;
padding:10px;
font-size:16px;
font-weight:700;
color:#fff;
border-radius:3px;
background:linear-gradient(to bottom,#59d0f8 5%,#49c0e8 100%);
cursor:pointer
}
#button:hover,#button2:hover {
background:linear-gradient(to bottom,#49c0e8 5%,#59d0f8 100%)
}
input[type=text] {
margin-top:5px;
margin-bottom:20px;
width:96%;
border-radius:5px;
border:0;
padding:5px 0
}
#firstname,#lastname,#email,#password,#company {
padding-left:10px
}
input[type=submit] {
width:30%;
border:1px solid #59b4d4;
background:#0078a3;
color:#eee;
padding:3px 0;
border-radius:5px;
margin-left:33%;
cursor:pointer
}
input[type=submit]:hover {
border:1px solid #666;
background:#555;
color:#fff
}
.ui-dialog .ui-dialog-content {
padding:2em
}
/* 960x610 */
div.container {
width:500px;
height:300px;
margin:50px auto;
font-family:'Droid Serif',serif;
position:relative
}
div.container2 {
width:960px;
height:610px;
margin:50px auto;
font-family:'Droid Serif',serif;
position:relative
}
div.main {
width:320px;
margin-top:35px;
float:left;
padding:10px 55px 25px;
background-color:rgba(204,204,191,0.51);
border:15px solid #fff;
box-shadow:0 0 10px;
border-radius:2px;
font-size:13px;
text-align:center
}
div.main2 {
width:320px;
margin-top:35px;
float:left;
padding:10px 55px 25px;
background-color:rgba(204,0.51);
border:15px solid #fff;
box-shadow:0 0 10px;
border-radius:2px;
font-size:13px;
text-align:center
}

<!DOCTYPE html>
<html>
<head>
<title>jQuery Dialog Form Example</title>
<link href="http://enersen.no/development/eds/css/test001.css" rel="stylesheet">
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/themes/ui-darkness/jquery-ui.css" rel="stylesheet">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js"></script>
<script src="http://enersen.no/development/eds/js/user.js" type="text/javascript"></script>
<!-- script src="http://enersen.no/development/eds/js/company.js" type="text/javascript"></script -->
</head>
<body>


<div class="container">
<div class="main">
<div id="dialog" title="Dialog Form">
<form action="" method="post">
<label>First name:</label>
<input id="firstname" name="firstname" type="text">
<label>Last name:</label>
<input id="lastname" name="lastname" type="text">
<label>Email:</label>
<input id="email" name="email" type="text">
<label>Password:</label>
<input id="password" name="password" type="password">
<input id="submit" type="submit" value="Submit">
</form>
</div>
<h2>jQuery Dialog Form Example</h2>
<p>Click below button to see jQuery dialog form.</p>
<input id="button" type="button" value="Open Dialog Form">
</div>
</div>


<div class="container2">
<div class="main2">
<div id="dialog2" title="Dialog Form 2">
<form action="" method="post">
<label>New comany name:</label>
<input id="company" name="company" type="text">
<input id="submit" type="submit" value="Submit">
</form>
</div>
<h2>jQuery Dialog Form Example</h2>
<p>Click below button to see jQuery dialog form.</p>
<input id="button2" type="button" value="Open Company Dialog Form">
</div>
</div>


</body>
</html>

我希望我激活的表格是所评估的表格。现在，它是用于评估地址/登录信息的表单。我想我需要一些代码片段来让med将表单作为Javascript中的不同文档来处理？

您有多个ID为@foreach (var item in (MyObject)ViewBag.DataGrid) {...}的提交按钮-只需将它们更改为唯一-在使用submit属性的情况下，页面上的提交按钮就应该始终是唯一的。

例如，将id用作一个，然后更改它：

userRegistrationSubmit

到

$("#submit").click(function(e) {

您可以呼叫另一个$("#userRegistrationSubmit").click(function(e) {。

谢谢，杰米克（Jamiec），您将我指向了正确的方向，我解决了:-)结果如下：

$(document).ready(function() {
    $(function() {
        $("#userDialog").dialog({
            autoOpen: false
        });
        $("#companyDialog").dialog({
            autoOpen: false
        });
        $("#userButton").on("click",function() {
            $("#userDialog").dialog("open");
        });
        $("#companyButton").on("click",function() {
            $("#companyDialog").dialog("open");
        });
    });
    // Validating Form Fields.....
    $("#userSubmit").click(function(e) {
        var email = $("#email").val();
        var comnpanyname = $("#companyname").val();
        var lastname = $("#lastname").val();
        var password = $("#password").val();
        var emailReg = /^(([^<>()\[\]\.,;:\s@\"]+(\.[^<>()\[\]\.,;:\s@\"]+)*)|(\".+\"))@(([^<>()[\]\.,;:\s@\"]+\.)+[^<>()[\]\.,;:\s@\"]{2,})$/i;
        if (firstname === '' || lastname === '' || password === '' || email === '') {
            alert("Please fill all fields!");
            e.preventDefault();
        } else if (!(email).match(emailReg)) {
            alert("Invalid Email!");
            e.preventDefault();
        } else {
            alert("Form Submitted Successfully.");
        }
    });
});

一页网页中与JavaScript有关的多种形式

endy1009 回答：一页网页中与JavaScript有关的多种形式

大家都在问