bootstrap+javascript制作体重标准计算器

原创

于 2022-07-17 08:16:23 发布 · 677 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #bootstrap #前端 #html5

一、表单编辑

使用bootstrap可以快速创建表单样式。

needs-validation 可以验证表单，如果验证不通过，表单不会提交；
onSubmit="return false;"使得表单提交不会刷新页面；
下方js代码是用来控制表单验证；

<div class="container">
	<div class="row" id="app">
		<div class="col-4">
				<form action="" class="needs-validation" onSubmit="return false;">
				  <div class="form-group">
					   <h2 class="text-center">体型</h2>
					   <label for="s_height">年龄:</label>
					   <input type="number" class="form-control" placeholder="输入周岁" id="s_age" min="16" max="39" required>
						<label for="s_height">身高（cm）: