0

我正在尝试在使用 bootbox 插件提交表单时弹出确认消息。问题是我不知道如何选择表单标签内的按钮。在下面的示例中,确认消息确实适用于表单标签之外的按钮,但不适用于里面的按钮。如何选择包裹在表单标签内的这个按钮?

<div class="bs-example">
<div class="col-md-4 col-md-offset-4">
<form action="#" method="POST">
    <div class="form-group">
        <input type="username" class="form-control" id="inputEmail" placeholder="Username">
    </div>
    <div class="form-group">
        <input type="email" class="form-control" id="inputEmail" placeholder="Email">
    </div>
    <div class="form-group">
        <input type="password" class="form-control" id="inputPassword" placeholder="Password">
    </div>
    <div class="form-group">
        <input type="password" class="form-control" id="inputPassword" placeholder="Repeat password">
    </div>  
    <div class="checkbox">
        <label><input type="checkbox"> Remember me</label>
    </div>
            <button class='btn btn-signup btn-signup-sm' type="submit">Sign up</button>
</form>
</div>
</div>

<button class='btn btn-signup btn-signup-sm' type="submit">Sign up</button>

<script type="text/javascript">
$(document).ready(function(){
$('.btn').on('click', function(){
    bootbox.alert("hello there");
});
});
</script
4

2 回答 2

1

为什么不捕捉表单的提交事件?

给你的表格一个像"<form method="POST" id="my_form">...</form>"

并使用:

$('#my_form').submit(function(){
   bootbox.alert("hello there");
});

看看你的小提琴在这里!

于 2014-09-25T15:11:41.547 回答
1

将javascript代码更改为:

<script type="text/javascript">
$(document).ready(function(){
$('.btn').on('click', function(e){
    e.preventDefault();          // this line is key to preventing page reload
                                 // when user clicks submit button inside form
    bootbox.alert("hello there");
});
});
</script>
于 2014-09-25T15:25:51.130 回答