点击功能在我的Web应用程序中不起作用

Question

I have a modal for signup and signin . Inside signup modal when I want to go to signin modal from here and click to signin button then signup modal will hide and signin modal will appear. From same procedure happen to signin modal.

But here these signin or signup button inside the modal haven't work.

I have also used e.preventDefault(); inside the js function but still doesn't work.

I don't find out the script problem since I am not good in JS.

signin modal

<div class="modal fade bs-modal-sm" id="signin_modal" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true">
                    <div class="modal-dialog modal-sm">
                        <div class="modal-content">
                            <br>
                            <div class="bs-example bs-example-tabs">
                                <ul id="signin_myTab" class="nav nav-tabs">
                                  <center><li id="signin_Modal_tab" class="active"><a href="#signin" data-toggle="tab">SIGN IN</a></li></center>
                                </ul>
                            </div>
                          <div class="modal-body">
                            <div id="myTabContent" class="tab-content">
                                <div class="tab-pane fade active in" id="signin">

                                    <span id="student_signin_error"></span>

                                    <form class="form-horizontal" id="signin_form">
                                    <input type="hidden" name="_token" id="csrf-token" value="{{ Session::token() }}" />
                                    <fieldset>
                                    <!-- Sign In Form -->

                                    <!-- Email input-->
                                    <div class="control-group">
                                      <div class="controls">
                                        <input required="" id="signin_email" name="email" class="col-ld-12 col-md-12 col-sm-12" type="email" placeholder="Email" class="input-medium">
                                      </div>
                                    </div>

                                    <div class="control-group">
                                      <div class="controls">
                                        <input required="" id="signin_password" name="password" class="col-ld-12 col-md-12 col-sm-12" type="password" placeholder="Password" class="input-medium">
                                      </div>
                                    </div>

                                    <!-- Button -->
                                    <div class="control-group">
                                      <div class="controls modal_submit_button">
                                        <button type="button" class="btn btn-success" id="signin_form_submit_button">Sign In</button>
                                      </div>
                                    </div>

                                     <div class="control-group">
                                      <div class="controls modal_submit_button">
                                        Don't have an account ! Click here to 
                                        <a href="#" class="signup_from_signin_modal">Sign Up</a>
                                      </div>
                                    </div>
                                    </fieldset>
                                    </form>
                                </div>
                            </div>
                          </div>
                          <div class="modal-footer">
                            <center>
                                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                            </center>
                          </div>
                        </div>
                    </div>
                </div>

Script

$(document).ready(function(){
$('.signup_from_signin_modal').click(function(e) {
    e.preventDefault();
    $('#signin_Modal').modal('hide');
    $('#myModal').modal('show');
});
});

If I called alert() inside that script function it will work. But $('#signin_Modal').modal('hide'); this function doesn't work.

Anybody Help please ?

Thanks in advance.

Answer 1

You have accidentally in your jQuery selector put signin_Modal ,

instead you should be trying to select signin_modal .

This is just something that happens from time to time in coding, happy hacking :)