Bootstrap被封装的弹层

Bootstrap被封装的弹层

对于Bootstrap的弹层，插件有很多，今天主要用的是它自带的功能，通过bootstrap提供的模式窗口来实现的，而主要对使用方法进行了封装，开发人员可以自己动态传入弹层的ＨＴＭＬ内容，可以控制按钮的显示与隐藏，用户通过ＭＶＣ扩展方法对弹层进行生成，然后使用A标签进行调用．

具体使用很简单

@Html.GenerateDialog("测试",true,

@

测试弹层

上面代码分为两块，第一块ＭＶＣ扩展方法，主要用于在页面上输出弹层的代码段，第二段是Ａ标签的调用，主要用于绑定上面的弹层控件．

下面主要看一下弹层的扩展方法，它使用了Func这个委托，用来接收前台的HTML代码段，这对于开发人员是个福音，你不用关心如何去拼接ＨＴＭＬ代码了，而是直接把前台给我们的代码复制过来即可．

弹层方法

#region Bootstrap弹层

///

/// bootstrap风格的弹层

///

///

///

///

///

public static MvcHtmlString GenerateDialog(this HtmlHelper htmlHelper, bool isBtn, Func result)

{

return GenerateDialog(htmlHelper, "详细", isBtn, result);

}

///

/// bootstrap风格的弹层

///

///

/// &http://lt;/param>

///

///

///

public static MvcHtmlString GenerateDialog(this HtmlHelper htmlHelper, string title, bool isBtn, Func result)

{

string templete = @"

data-dismiss='modal' aria-hidden='true'>

×

data-dismiss='modal' aria-hidden='true'>

×

@"

" + result.Invoke(null) + "

if (isBtn)

{

templete +=

@"

data-dismiss='modal'>

关闭

data-dismiss='modal'>

关闭

提交

}

templete +=

@LAGNNulmwq"

";

return MvcHtmlString.Create(templete);

}

#endregion

而运行的效果是我们可以想到的

以上所述是给大家介绍的Bootstrap被封装的弹层，希望对大家有所帮助，如果大家有任何疑问请给我留言，会及时回复大家的。在此也非常感谢大家对我们网站的支持！

版权声明：本文内容由网络用户投稿，版权归原作者所有，本站不拥有其著作权，亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容，请联系我们jiasou666@gmail.com 处理，核实后本网站将在24小时内删除侵权内容。