jquery – 引导模态链接

前端之家收集整理的这篇文章主要介绍了jquery – 引导模态链接前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
如何使按钮成为一个链接,并在引导3中有一个弹出窗口?

<a href="" data-toggle="modal" data-target=".bannerformmodal">Load me</a>

<div class="modal fade bannerformmodal" tabindex="-1" role="dialog" aria-labelledby="bannerformmodal" aria-hidden="true">
  <div class="modal-dialog modal-sm">
    <div class="modal-content">
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
          <h4 class="modal-title" id="myModalLabel">Contact Form</h4>
        </div>
        <div class="modal-body">
          <form id="requestacallform" method="POST" name="requestacallform">

            <div class="form-group">
              <div class="input-group">                               
                <span class="input-group-addon"><i class="fa fa-user"></i></span>
                <input id="first_name" type="text" class="form-control" placeholder="First Name" name="first_name"/>
              </div>
            </div>
            <div class="form-group">
              <div class="input-group">                               
                <span class="input-group-addon"><i class="fa fa-user"></i></span>
                <input id="last_name" type="text" class="form-control" placeholder="Last Name" name="last_name"/>
              </div>
            </div>
            <div class="form-group">
              <div class="input-group">                               
                <span class="input-group-addon"><i class="fa fa-envelope"></i></span>
                <input id="email1" type="text" class="form-control" placeholder="Email" name="email1" onchange="validateEmailAdd();"/>
              </div>
            </div>
            <div class="form-group">
              <div class="input-group">                               
                <span class="input-group-addon"><i class="fa fa-group"></i></span>
                <input id="company_name_c" type="text" class="form-control" placeholder="Company Name" name="company_name_c"/>
              </div>
            </div>
            <div class="form-group">
              <div class="input-group">                               
                <span class="input-group-addon"><i class="fa fa-phone"></i></span>
                <input id="phone_mobile" type="text" class="form-control" placeholder="Mobile" name="phone_mobile"/>
              </div>
            </div>
            <div class="form-group">
              <div class="input-group">
                <span class="input-group-addon"><i class="fa fa-building-o"></i></span>
                <select class="form-control" name="monthly_rental" class="selectpicker">
                  <option>How many seats do you have available?</option>
                  <option>10-50</option>
                  <option>50-100</option>
                  <option>100-200</option>
                  <option>200-500</option>
                  <option>500+</option>
                </select>
              </div>
            </div>
            <div class="control-group">
              <div class="controls">                     
                <textarea id="description" type="text" name="description"  placeholder="Description"></textarea>
              </div>
            </div>

          </form>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-blue">Submit</button>
        </div>        
      </div>
    </div>
  </div>
</div>

解决方法

删除。从你的目标应该是一个id
<a href="#" data-toggle="modal" data-target="#bannerformmodal">Load me</a>

另外你必须给出你的模态ID,如下所示

<div class="modal fade bannerformmodal" tabindex="-1" role="dialog" aria-labelledby="bannerformmodal" aria-hidden="true" id="bannerformmodal">

希望这将解决问题,如果仍然存在,将为您创造一个小提琴。

猜你在找的jQuery相关文章