相关疑难解决方法(0)

我需要能够使用onClick=""或类似的功能打开Twitter引导模式窗口.只需要代码进入onClick="".我想点击一下div打开模态.

代码摘录:

Div代码:

<div class="span4 proj-div" onClick="open('GSCCModal');">

模态Div代码:

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

使用Javascript:

function open(x){
    $(x).modal('show');
}

我正在使用Twitter引导程序,警报框上的关闭淡出比我想要的要快.有什么地方我可以改变淡入淡出的持续时间,或者甚至可以在每个警报的基础上设置它？

谢谢

我不想在问题/答案中建议使用angular2-bootstrap或ng2-bs3-modal Angular 2 Bootstrap Modal 和Angular 2.0 and Modal Dialog

现在.我知道什么打开和关闭引导模式.

• 显示屏在display: none;和之间切换display: block;
• 一个属性可打开,div之间aria-hidden="true"并aria-hidden="false

所以,我自然认为如果我这样绑定aria-hidden属性[aria-hidden]="true",我就可以操纵它.可悲的是,我不能约束,aria-hidden因为它不是一个已知的属性div.(注意,attr.aria-hidden不存在)

我知道这可以用JQuery实现$('#myModal').modal()如下问题所示如何使用jQuery打开一个Bootstrap模式窗口？

所以我的问题是,是否有一个TypeScript功能modal()与JQuery 做同样的事情,或者有没有办法将函数/变量绑定到aria-hidden？

我目前html:

<div id="createAccountModal" class="modal fade customForm" role="dialog" [aria-hidden]="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h4>Create account</h4>
            </div>
            <div class="modal-body">
               <p>Lorem ipsum</P>
            </div>
            <div class="modal-footer align-left">
                My custom footer
            </div>
        </div> …

我需要在我的页面中的ajax的成功函数中弹出一个bootstrap模式.当提交表单时调用成功函数..,有没有任何方法弹出bootstrap模式而不点击按钮.我是一个新手..,请帮帮我.这是我的ajax电话..

     $("#form").submit(function(e)
   {
       $.ajaxSetup({
           headers:{'X-CSRF-Token' : $('meta[name=_token]').attr('content')}
       });
    e.preventDefault(); //STOP default action
    var postData = $(this).serializeArray();
    console.log(postData);


    var formURL =  "http://localhost:8000/v1/people_roles";

    $.ajax(
    {


        url :formURL ,
        type: "POST",
        data : postData,
        success:function(response, textStatus, jqXHR)
    {

        if(response.parent==1)
        {
            $("#getCode").html(response);
            $("#getCodeModal").modal('show');
             window.location.href="/web/staff/detail.php?id="+response.people_id;
        }
        else
        {
            //console.log(response);
            window.location.href="/web/staff/detail.php?id="+response.people_id;
        }
    }



    });   
    });

这是我的html模态代码..

    <div class="modal fade" id="getCodeModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-lg">
     <div class="modal-content">
     <div class="modal-header">
         <h4 class="modal-title">Modal title</h4>
     </div>
     <div class="modal-body">
         <p><strong>Lorem Ipsum is simply dummy</strong> text of the printing …

我点击一个按钮时打开了一个模态.现在我想在javascript函数中打开模态.这是工作模式:

<a href="#" class="btn btn-lg btn-primary" id="sentMessage" data-toggle="modal" data-target="#largeModal">Click to open Modal</a>
    <div class="modal fade" id="largeModal" tabindex="-1" role="dialog" aria-labelledby="largeModal" aria-hidden="true">
      <div class="modal-dialog modal-lg">
        <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">Large Modal</h4>
          </div>
          <div class="modal-body">
            <h3>Modal Body</h3>
          </div>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button type="button" class="btn btn-primary">Save changes</button>
          </div>
        </div>
      </div>
    </div>

我想在javascript函数中打开相同的模态.因此,要模拟此功能,我创建另一个触发功能的按钮:

<a href="#" ng-click="openModal();" class="btn btn-lg btn-primary">Click to execute js</a>

这是我的openModal函数:

$scope.openModal = function(){
    $("#sentMessage").click();

};

当我点击"Click to execute js"按钮时,模态不会打开.这是掠夺者

我试图通过单击ActionLink并传递如下参数来在同一页面上打开我的引导模式:

@foreach (Items item in Model)
{
  @Html.ActionLink("Download", "#", new { data-id = '@item.Name' } )
}

//Modal
<div id="dModal" class="modal hide fade" aria-hidden="true">
   <div class="modal-body">
      @using (Html.BeginForm("getCSV", "Download", new { filename = data-id }, FormMethod.Post, null))
      {
        <button id="btnCSV" type="submit">Download CSV</button>
      }
      //other options for excel, word etc
   </div>
</div>

在ActionLink中,我将actionName参数保留为#,这是因为模式位于同一页面上,当用户选择模态中的选项时,将决定操作.不直接调用下载操作方法的原因是因为用户可以选择以各种格式下载excel,csv等.

我试图使用没有表单的jQuery动态地找出一个模态框.

 <a href="#openModal">Open Modal</a>

<div id="openModal" class="modalDialog">
  <div> <a href="#close" title="Close" class="close">X</a>

    <h2>Modal Box</h2>

    <p>This is a sample modal box that can be created using the powers of CSS3.</p>
    <p>You could do a lot of things here like have a pop-up ad that shows when your website loads, or create a login/register form for users.</p>
  </div>

我有一个提交下载文件后的表单.我想自动而不是自动下载文件..显示模态对话框并显示下载链接.

<form name="softwareform" id="softwareform" action="../downloadlink.php" method="POST" align="left">
  <div class="input-group margin-bottom-sm">
      <span class="input-group-addon">
         <i class="fa fa-windows fa-fw"></i>
      </span>
      <input class="form-control" type="text" placeholder="Software Title" name="softtitle" id="softtitle">
  </div>

  <button type="submit" class="btn btn-primary"  >
      <i class="fa fa-cogs"></i>Download File
  </button>
</form>

在下载link.php中,我使用标题重定向到下载文件.这是我想要显示的模态对话框.

<div class="modal fade bs-modal-sm" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true">
   <div class="modal-dialog modal-sm">
      <div class="modal-content" id="dialog-download">
         <br/><br/>
         <h2>Your Download is ready.</h2>
         <hr/>
         Your Download link is here <br/>
      </div>
   </div>
</div>

如何在表单提交后显示此对话框？提前致谢

我有一个按钮，像这样：

<a data-toggle="modal" href="#influencerModal" class="btn btn-primary influencer-card">Influencer Profile</a>

当我单击它时，我不希望模态打开，以便我可以将一些内容 ajax 放入其中，然后使用.modal().

没有在网上看到很多关于在单击打开按钮后停止它的想法的有用项目。

有任何问题，请在下面提问。

我想尝试一个小技巧来提高我网站的跳出率.当用户将光标移动到页面顶部的第一个5px时,我想他想要离开页面,所以我想给他一个带搜索框或一些相关文章的模态.

所以我们在这里:

$(document).ready(function(){
$( "#test" ).hover(function() {
        //alert("testing the mouseover");
        return false;
});  
});
 

问题是我不知道如何用我的bootstrap模式替换警报.

<div class="modal fade bs-example-modal-sm" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-sm">
    <div class="modal-content">
      ...
    </div>
  </div>
</div>

当我点击堆叠的highcharts列时,我试图触发一个bootstrap模式.正如我试图弄清楚当我点击高图中的不同列时,模态值必须根据1s中的值进行更改

$(function () {
    $('#container').highcharts({
        chart: {
            type: 'area',
			options2d: {
                enabled: true,
                alpha: 45,
                beta: 0
            }
        },
		title: {
            text: 'Exams Report'
        },
        xAxis: {
		    title: {
                text: 'Classes'
            },
            categories: ['1st class', '2nd class', '3rd class', '4th class', '5th class','6th class', '7th class', '8th class', '9th class', '10th class']
        },
        yAxis: {
            min: 0,
            title: {
                text: 'Exams Report'
            },			
            stackLabels: {
                enabled: false,
                style: {
                    fontWeight: 'bold',
                    color: (Highcharts.theme && Highcharts.theme.textColor) || 'gray'
                }
            }
        }, …

在网上搜索了几个小时之后,我找到了一些关于如何在另一个Modal中打开新Modal的解决方案.但我的要求有点不同.我想使用一个有点"通用"的模态形式,它将作为我页面中的消息框(不是整个应用程序,仅适用于当前页面).一旦被调用/显示,此消息框将覆盖所有内容.

例如,我为我的数据输入打开一个Modal表单,如果我想向用户提示一条消息,我将在数据输入表单上弹出另一个Modal表单.

我是网络编程的新手,所以我不知道我的代码出了什么问题,或者我错过了什么.

这是我的设计师的代码:

<div class="modal fade" id="modAddBulletin" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="top: 15%;" data-keyboard="false" data-backdrop="static">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h3 class="modal-title" id="H2"><asp:Label ID="Label3" runat="server" Text="Add Bulletin"></asp:Label></h3>
                </div>
                <div class="modal-body" style="padding-bottom:0px">
                    <div="container">
                      <div>
                      <fieldset class="form-group">
                        <label for="txtTitle">Title</label>
                        <input id="txtTitle" runat="server" type="text" class="form-control"  />
                      </fieldset>

                      <fieldset class="form-group">
                        <label for="txtDescription">Description</label>
                        <textarea class="form-control" runat="server" id="txtDescription" rows="6" style="min-width:568px; min-height:151px; max-width: 568px;"></textarea>
                      </fieldset>

                      <fieldset class="form-group">
                      <asp:FileUpload ID="fleUpload" runat="server" data-filename-placement="inside" />
                      </fieldset>
                      </div>

                   </div>
                <div class="modal-footer">    
                        <asp:LinkButton ID="btnUpload" runat="server" CssClass="btn btn-success" Width="200px">
                        <span class="glyphicon …