背景 我有一个表单,一旦提交显示一个bootbox对话框。如果在表格上选择了是,则会公布详细的表格。
问题
一旦在对话框上点击了,我想要一个div来表示“谢谢你吧”
我的解决方案
我添加了div并使用CSS隐藏了
.fConfirm
{
display:hidden;
}
然后在我的js中,一旦提交的表单我试图通过添加此行来更改CSS属性
$('.fConfirm').css({display:inline-block; height: 680px; width:940px;});
这行代码会杀死整个函数并阻止对话框显示?
我接近这个错误的方式吗?
“fConfirm”Div
<div class="fConfirm">
<h2>Thank you</h2>
<p>Columbus Car Finder Group will now start looking for your perfect car and will contact you by one of the contact methods you have given us. If you have any questions or would like to change anything about your search feel free to either call or send us an email. </p>
</div>
JQuery的
$('#form1').submit(function(e) {
var currentForm = this;
e.preventDefault();
bootbox.confirm("Are you sure?", function(result) {
if (result) {
console.log("before display");
currentForm.submit();
$('.fConfirm').css({display:inline-block; height: 680px; width:940px; background: rgb(192, 192, 192); background: rgba(192, 192, 192, 0.5));
console.log("after display");
}
});
});
答案 0 :(得分:3)
对象属性通过逗号分隔,而不是分号。另外,请务必引用display
的属性值 - 它当前正尝试从变量block
中减去变量inline
:
$('.FConfirm').css({
display:"inline-block",
height: 680,
width: 940
});
答案 1 :(得分:2)
在这种情况下,你最好使用.addClass:
最初隐藏课程:
.fConfirm {
display: none;
}
创建要在要显示时添加的类:
.my_class {
display:inline-block;
height: 680px;
width:940px;
}
使用jQuery触发:
$('.fConfirm').addClass('my_class');
这是理想的原因是因为它使你的CSS与你的JS分开,这将证明随着时间的推移是有益的。如果您只在JS中使用此类,那么可以使用&#34; js&#34; (即&#34; .js-my_class&#34;)
答案 2 :(得分:0)
用引号括起值,否则JS会认为它们是变量:
$('.fConfirm').css({display:'inline-block', height: '680px', width:'940px'});
另请注意,您的div类实际上是fConfirm
,FConfirm
和confirm
。
答案 3 :(得分:0)
jQuery的submit函数只是拦截当某人以任何方式提交表单时触发的'submit'事件的一种方式。
我想到的方式是:“好吧,我们有这个名为X的表单然后,当有人触发此表单的提交时,不要像通常那样行事(让我们阻止默认)并执行某些操作不同”。
在谈论处理提交事件但你最后调用.submit()
时,你正在做什么是好的,然后你会做你不想要的事情 - 执行提交然后“杀死方法”。
请参阅小提琴:http://jsfiddle.net/knLkw/
tl; dr :请勿在稍后调用.submit
,但执行异步操作。