对于第一个代码，点击提交按钮而不填写任何文本，它显示为“请填写此字段” 对于第二个代码，单击提交按钮时不显示或提交代码。我需要提交按钮以显示“请填写此字段”，同时点击它。
<!------------------1st html code------------>
<html>
<body>
<section id="contact-page">
<div class="container">
<div class="center" style="padding-top: 100px; border-bottom-width: 10px;padding-bottom: 50px;">
<h2>Drop Your Message</h2>
<p class="lead"><b><em>Education is the most powerful weapon we can use to change the world</em></b></p>
</div>
<div class="row contact-wrap" style="margin-top:00px;">
<form action="sendemail.php" data-ajax="false" method="post" class="form">
<div class="col-sm-5 col-sm-offset-1">
<div class="form-group">
<label for="Name">Name *</label>
<input type="text" id="Name" name="name" class="form-control" required="required" placeholder="Enter your name">
</div>
<div class="form-group">
<label for="Email">Email *</label>
<input type="email" id="Email" name="email" class="form-control" required="required" placeholder="Enter email-id">
</div>
<div class="form-group">
<label for="phone">Phone *</label>
<input type="tel" id="phone" name="phone" pattern="^\d{4}\d{3}\d{3}$" class="form-control" required="required" placeholder="Enter number">
</div>
<div class="form-group">
<label for="Subject">Subject *</label>
<input type="text" id="Subject" name="subject" class="form-control" required="required" placeholder="Enter subject">
</div>
</div>
<div class="col-sm-5">
<div class="form-group">
<label for="Message">Message *</label>
<textarea name="message" id="Message" name="Message" required="required" class="form-control" rows="9" placeholder="Enter message"></textarea>
</div>
<div class="form-group">
<button type="submit" name="submit" class="btn btn-primary btn-lg" required="required">Submit Message</button>
</div>
</div>
</form>
</div>
<!--/.row-->
</div>
<!--/.container-->
</section>
<!--/#contact-page-->
</body>
</html>
<!-----------------------------------1st code completed------------>
<!---------------------2nd html code--------->
<html>
<body>
<div class="row">
<div class="col-sm-8">
<div class="contact-form">
<h2 class="title text-center">Get In Touch</h2>
<div class="status alert alert-success" style="display: none"></div>
<form id="main-contact-form" class="contact-form row" name="Enquiry-form" method="post" action="sendemail.php" data-ajax="false" style="margin-bottom: 0px;">
<div class="form-group col-md-6" style="padding-left: 30px;">
<input type="text" name="Name" id="Name" class="form-control" placeholder="Name" required="required">
</div>
<div class="form-group col-md-6">
<input type="tel" pattern="^\d{4}\d{3}\d{3}$" id="phone" name="phone" class="form-control" required="required" placeholder="Contact Number" style="width: 387px;">
</div>
<div class="form-group col-md-12">
<form name="myform" action="">
<input type="radio" id="radiobutton1" value="text1" style="margin-left: 15px; margin-right: 5px;" />
<input type="text" id="profession1" enabled="enabled" placeholder="Category of the Business if Self-employ" style="margin-left: 15px; width: 349px;" />
<input type="radio" id="radiobutton2" value="text2" style="margin-left: 30px;margin-right: 5px;" />
<input type="text" id="profession2" disabled="disabled" placeholder="Company name if Employee" style="margin-left: 15px; width: 345px;" />
</form>
</div>
<script>
var radiobutton1 = document.getElementById('radiobutton1');
var radiobutton2 = document.getElementById('radiobutton2');
radiobutton1.onchange = function() {
radiobutton2.checked = !this.checked;
document.getElementById('profession1').disabled = !this.checked;
document.getElementById('profession2').disabled = this.checked;
};
document.getElementById('radiobutton2').onchange = function() {
radiobutton1.checked = !this.checked;
document.getElementById('profession2').disabled = !this.checked;
document.getElementById('profession1').disabled = this.checked;
};
</script>
<div class="form-group col-md-4" style="width: 236px;">
<input type="text" name="productid" id="productid" class="form-control" required="required" placeholder="Product Id" style="width: 236px;">
</div>
<div class="form-group col-md-4" style="width: 269px; padding-left: 45px;">
<input list="Category" id="producttype " name="producttype" class="form-control" required="required" placeholder="Product Type" style="width: 269px;">
<datalist id="Category">
<option value="Consumer Products">
<option value="Cosmetics">
<option value="Food Products">
<option value="Energy Drinks">
</datalist>
</div>
<div class="form-group col-md-4" style="width: 236px; padding-left: 73px;">
<input type="text" name="Productquantity" id="Productquantity" class="form-control" required="required" placeholder="Product Quantity" style="width: 236px;">
</div>
<div class="form-group col-md-6">
<input type="email" name="Email" id="Email" class="form-control" required="required" placeholder="Email">
<br>
<textarea name="Message" id="Message" required="required" class="form-control" rows="5" placeholder="Comment Here" style="height: 114px;"></textarea>
</div>
<div class="form-group col-md-6" style="height: 144px;">
<textarea name="Shippingaddress" id="Shippingaddress" class="form-control" rows="5" placeholder="Shipping Address" required="required" style="height: 179px;"></textarea>
</div>
<div class="form-group col-md-12" style="padding-right: 0px; padding-left: 330px;">
<button type="submit" name="submit" class="btn btn-primary btn-lg" style="padding-left: 25px;" required="required">Submit Message</button>
</div>
</form>
</div>
</div>
</body>
</html>
<!-----------------------------------2nd html code completed----------->
答案 0 :(得分：1)
在第二个示例中，您使用的是嵌套表单。请尝试删除嵌套表单，它将起作用