Jquery 修复其中所有选项卡的引导模式内容大小

Jquery 修复其中所有选项卡的引导模式内容大小,jquery,html,css,tabs,bootstrap-modal,Jquery,Html,Css,Tabs,Bootstrap Modal,我有一个带3个标签的引导模式。每个选项卡的模式内容大小都不同。我想修复所有选项卡的模式内容。 我必须做什么 我的代码: <ul id="EditTabs" class="nav nav-tabs " role="tablist"> <li class="active"> <a href="#first" role="tab" data-toggle="tab"> <icon class="fa fa-us

我有一个带3个标签的引导模式。每个选项卡的模式内容大小都不同。我想修复所有选项卡的模式内容。 我必须做什么

我的代码:

<ul id="EditTabs" class="nav nav-tabs " role="tablist">
    <li  class="active">
        <a href="#first" role="tab" data-toggle="tab">
            <icon class="fa fa-user" ></icon> مشخصات
        </a>
    </li>
    <li id="ImageEditLiTab">
        <a href="#second" role="tab" data-toggle="tab">
            <i class="fa fa-picture-o"></i> عکس
        </a>
    </li>
    <li id="LiGoogleMapEditThird">
        <a href="#third" role="tab" data-toggle="tab">
            <i class="glyphicon glyphicon-map-marker"></i> نقشه
        </a>
    </li>
</ul>
<!-- Tab panes -->
<div class="tab-content">
    <div class="tab-pane fade active in" id="first">

        <!--------- end input texts-------------->
        <br>
        <!-- Text input-->

        <div  class="form-group">
            <div class="col-md-8  inputGroupContainer">
                <div  dir="ltr" class="input-group">
                    <input dir="rtl" id="EditStudentFirstName"  name="EditStudentFirstName" placeholder="نام" class="form-control"  type="text">
                    <span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span>
                </div>
            </div>
            <label for="EditStudentFirstName" class="col-md-3 control-label">نام           </label>
        </div>

        <!-- Text input-->

        <div  class="form-group">
            <div class="col-md-8 inputGroupContainer">
                <div dir="ltr" class="input-group">
                    <input dir="rtl" id="EditStudentLastName" name="EditStudentLastName" placeholder="نام خانوادگی" class="form-control"  type="text">
                    <span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span>
                </div>
            </div>
            <label for="EditStudentLastName" class="col-md-3 control-label" >نام خانوادگی         </label>
        </div>

        <!-- Text input-->

        <div class="form-group">
            <div class="col-md-8 inputGroupContainer">
                <div dir="ltr" class="input-group">
                    <input dir="rtl" id="EditStudentAddress" name="EditStudentAddress" placeholder="آدرس" class="form-control" type="text">
                    <span class="input-group-addon"><i class="glyphicon glyphicon-home"></i></span>
                </div>
            </div>
            <label for="EditStudentAddress" class="col-md-3 control-label">آدرس منزل       </label>
        </div>

        <!-- Text input-->
        <div  class="form-group">

            <div class="col-md-8 inputGroupContainer">
                <div dir="ltr" class="input-group">
                    <input dir="rtl" id="EditStudentZip" name="EditStudentZip" placeholder="کد پستی" class="form-control"  type="text">
                    <span class="input-group-addon"><i class="glyphicon glyphicon-home"></i></span>
                </div>
            </div>
            <label for="EditStudentZip" class="col-md-3 control-label">کد پستی   </label>
        </div>

        <!-- Text input-->
        <div  class="form-group">

            <div class="col-md-8 inputGroupContainer">
                <div dir="ltr" class="input-group">
                    <input dir="rtl" id="EditStudentPhone" name="EditStudentPhone" placeholder=" شماره تلفن منزل" class="form-control"  type="text">
                    <span class="input-group-addon"><i class="glyphicon glyphicon-phone-alt"></i></span>
                </div>
            </div>
            <label for="EditStudentPhone" class="col-md-3 control-label">شماره تلفن منزل  </label>
        </div>

        <!-- Text input-->
        <div  class="form-group">
            <div class="col-md-8 inputGroupContainer">
                <div dir="ltr" class="input-group">
                    <input dir="rtl" id="EditStudentMobile" name="EditStudentMobile" placeholder="شماره موبایل" class="form-control"  type="text">
                    <span class="input-group-addon"><i class="glyphicon glyphicon-phone"></i></span>
                </div>
            </div>
            <label for="EditStudentMobile" class="col-md-3 control-label">شماره موبایل   </label>
        </div>


        <!-- Text input-->
        <div  class="form-group">
            <div class="col-md-8 inputGroupContainer">
                <div dir="ltr" class="input-group">
                    <input dir="rtl" id="EditStudentUsername" name="EditStudentUsername" placeholder="نام کاربری دانش آموز" class="form-control"  type="text">
                    <span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span>
                </div>
            </div>
            <label for="EditStudentUsername" class="col-md-3 control-label">نام کاربری دانش آموز        </label>
        </div>

        <!-- Text input-->
        <div  class="form-group">
            <div class="col-md-8 inputGroupContainer">
                <div dir="ltr" class="input-group">
                    <input dir="rtl" id="EditStudentPass" name="EditStudentPass" placeholder="پسورد دانش آموز" class="form-control"  type="text">
                    <span class="input-group-addon"><i class="glyphicon glyphicon-lock"></i></span>
                </div>
            </div>
            <label for="EditStudentPass" class="col-md-3 control-label">پسورد دانش آموز   </label>
        </div>

        <!--------- end input texts-------------->

    </div><!-- End first Tab-->
    <div class="tab-pane fade" id="second" dir="ltr">

        <form id="imagesubmit2" action="http://79.132.212.50:8080/SchoolServiceWebService/user/photo/set" method="post" enctype="multipart/form-data">

            <input id="Adminusername2"  hidden type="textbox" name="username" size="45" />
            <input id="Adminuserpassword2" hidden type="textbox" name="password" size="45" />
            <input id="EditStudentuserid"  hidden  type="textbox" name="userid" size="45" />
            <!--  <input id="file-4" type="file" class="file" size="45" data-upload-url="http://79.132.212.50:8080/SchoolServiceWebService/user/photo/set">-->

           <!--  <input id="file-4" type="file" name="file" size="45" class="file col-md-6 file2" />-->

            <input id="input-24" name="file" type="file" multiple size="45"   class="file-loading col-md-6 file2">

        </form>

    </div><!-- End second Tab-->


    <div class="tab-pane fade" id="third">

        <br>
        <br>
        <br>
        <label for="Updateaddress_with_google">آدرس را بر روی نقشه مشخص کنید</label>

        <div class="span11">
            <div id="UpdateMap"></div>
        </div>
        <br>
        <br>
        <div class="row">

            <div class="col-md-4">
                <button id="Updatebutton_Google_Serach" type="button" class="btn btn-info" >جستجو</button>
            </div>
            <div class="col-md-8">
                <input  type="text" id="Updateaddress_with_google" name="Updateaddress_with_google" placeholder="جستجو" class="form-control" />
            </div>

        </div>

        <input type="text" hidden id="UpdatelatGoogleMap">
        <input type="text" hidden id="UpdatelngGoogleMap">
        <br>
    </div><!-- End third Tab-->

</div>

نام نام خانوادگی آدرس منزل کد پستی شماره تلفن منزل شماره موبایل نام کاربری دانش آموز پسورد دانش آموز


آدرس را بر روی نقشه مشخص کنید

جستجو
第一个选项卡的大小: 第二个选项卡的大小:

看,我现在已经更新了我的代码,它可以按照您的要求工作

下面给出的结帐代码可能会解决您的问题。 如果您想根据屏幕宽度更改模式的宽度,请使用
@media
查询
CSS

.custom类分配给modal.modal对话框{
宽度:50%;
}
.自定义类分配给modal.modal主体{
高度:400px;
溢出:自动;
}

引导示例
模态示例
开放模态
&时代;
模态头
模态中的一些文本


نام نام خانوادگی آدرس منزل کد پستی شماره تلفن منزل شماره موبایل نام کاربری دانش آموز پسورد دانش آموز


آدرس را بر روی نقشه مشخص کنید

جستجو

你尝试的代码在哪里?@HirenJungi,问题是你