jquery slide down通知窗体提交-nt工作？从用户（表格）获取的持续时间！ [英] jquery slide down notification on form submit-nt working?? Duration taken from user(form)!
本文介绍了jquery slide down通知窗体提交-nt工作？从用户（表格）获取的持续时间！的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
有人可以点亮如何在表单提交时产生通知或提醒吗？通知应该留在用户页面上由用户在表单中给出的时间。提交按钮将需要持续时间从窗体，并产生一个jquery通知/警报持续时间。我的代码没有产生预期结果
Can someone please throw light on how to produce notification or alerts on form submit? The notification should stay on users page for time given by user in form. Submit button will take duration from the form and produce a jquery notification/alert for that duration. My code is not producing intended results
$(document).ready(function() {
$("#form").validate({
rules: {
time: "required",
},
messages: {
time: "Please enter Time in Miliseconds",
}
});
$("#notify").hide();
$("#form").submit(function(e) {
$("#notify").slideDown();
var timeOut = parseInt($("#time").val()) || 100; // default timeout
setTimeout(function() {
$("#notify").slideUp();
}, timeOut);
return false;
}
});
#notify
{
width: 100%;
position: absolute;
top: 0;
left: 0;
height: 50px;
background: #FF0000;
opacity: 0.8;
display: none;
}
#message
{
width: 100%;
text-align: center;
padding-top: 15px;
}
#form .formelement
{
display: inline-block;
padding: 10px 10px;
width: 900px;
}
#form .formelement label{
float: left;
text-align: left;
width: 110px;
}
#form .submit {
padding: 10px;
width: 220px;
height: 40px;
}
#form .formelement label.error {
color: red;
display: inline-block;
margin: 4px 0 10px 100px;
padding: 0;
text-align: left;
width: 900px;
}
<body>
<div id="notify">
<div id="message">SUCCESSFULL</div>
</div>
<fieldset>
<form action="" id="form" >
<div class="formelement">
<label for="time">Time (in MiliSec): </label>
<input type="text" name="time" id="time"/>
</div>
<div class="formelement">
<input type="submit" value="Show Success" class="submit" id="subm"/>
</div>
</form>
</fieldset>
</body>
推荐答案
<div id="notification">
Notification content
</div>
<script>
$(function() {
$("#form").validate({
rules: {
time: "required",
},
messages: {
time: "Please enter Time in Miliseconds",
}
});
$("#notification").hide();
$("#form").submit(function(e) {
$("#notification").slideDown();
var timeOut = $("#time").val() || 100; // default timeout
setTimeout(function() {
$("#notification").slideUp();
}, timeOut);
return false;
}
});
</script>
这篇关于jquery slide down通知窗体提交-nt工作？从用户（表格）获取的持续时间！的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
