表单提交方式
方法一:利用form的onsubmit()函数(经常使用)
<script type="text/javascript"> function formdGet() { if(document.reply.title.value == ""){ //通过form名来获取form alert("please input the title!"); document.reply.title.focus(); return false; } if(document.forms[0].cont.value == ""){ //通过forms数组获取form alert("please input the content!"); document.reply.cont.focus(); return false; } return true; } } </script>
<form method="post" id="login_form" onsubmit="return formdGet();"> <div class="top_b">后台管理系统</div> <div class="cnt_b"> <div class="formRow"> <div class="input-prepend"> <span class="add-on"><i class="icon-user"></i></span><input type="text" id="username" name="username" placeholder="Username" /> </div> </div> <div class="formRow"> <div class="input-prepend"> <span class="add-on"><i class="icon-lock"></i></span><input type="password" id="password" name="password" placeholder="Password" /> </div> </div> </div> <div class="btm_b clearfix"> <!-- <button class="btn btn-inverse pull-right" type="submit">登录</button>--> <input type="submit" value="提交" /> </div> </form>
方法二:利用input类型为submit组件的onclick()函数
1.将上面form标签中的onsubmit="return validateForm()"属性,去掉。
2.为“提交”按钮添加onclick事件,如下:
<input type="submit" value="提交" onclick="return validateForm();">
方法三:利用button组件的onclick()函数,手动提交。
<input type="submit" /> 这样的按钮用户点击之后会自动提交 form,除非你写了javascript 阻止它。
<input type="button" /> 这就是一个按钮。如果你不写javascript 的话,按下去什么也不会发生。
<button> 这个按钮放在 form 中也会点击自动提交,比前两个的优点是按钮的内容不光可以有文字,还可以有图片等多媒体内容。(当然,前两个用图片背景也可以做到)。它的缺点是不同的浏览器得到的 value 值不同;可能还有其他的浏览器兼容问题。
其他标签,例如 a, img, span, div,然后用图片把它伪装成一个按钮。
<form method="post" id="login_form" onsubmit="return formdGet();"> <div class="top_b">后台管理系统</div> <div class="cnt_b"> <div class="formRow"> <div class="input-prepend"> <span class="add-on"><i class="icon-user"></i></span><input type="text" id="username" name="username" placeholder="Username" /> </div> </div> <div class="formRow"> <div class="input-prepend"> <span class="add-on"><i class="icon-lock"></i></span><input type="password" id="password" name="password" placeholder="Password" /> </div> </div> </div> <div class="btm_b clearfix"> <!-- <button class="btn btn-inverse pull-right" type="submit">登录</button>--> <input type="submit" value="提交" /> </div>
</form>
清空回声
浙公网安备 33010602011771号