asp.net-mvc-3 – 为mvc创建一个html帮助器

发布时间：2020-12-16 07:15:53 所属栏目：asp.Net 来源：网络整理

导读：我是mvc的新手,所以不确定这是否可行. 我有一些HTML基本上使用一些图像来创建一个漂亮的圆角框. 是否有可能在mvc3中创建一个帮助函数,允许我调用帮助器并将我想要的任何内容插入div标签的主区域. 这是我的HTML div class="rounded" div class="top" div clas

我是mvc的新手,所以不确定这是否可行.

我有一些HTML基本上使用一些图像来创建一个漂亮的圆角框.

是否有可能在mvc3中创建一个帮助函数,允许我调用帮助器并将我想要的任何内容插入div标签的主区域.

这是我的HTML

<div class="rounded">
    <div class="top">
        <div class="right">
        </div>
    </div>
    <div class="middle">
        <div class="right">
            <div class="content">
             Some how allow me to insert data into here
                <div class="Clear">
            </div>
        </div>
    </div>
    <div class="bottom">
        <div class="right">
        </div>
    </div>
</div>


</div>

我不想在任何地方复制这个我想要使用这个样式所以我希望我可以创建一些类型的帮助器,并在我需要使用此框并且允许我插入html时调用它

<div class="content">
             Some how allow me to insert data into here
                <div class="Clear">
            </div>

有没有人有什么建议？

谢谢

解决方法

对于自定义html助手来说,这似乎是一个很好的场景：

public class RoundedCorner : IDisposable
{
    private readonly ViewContext _viewContext;
    private bool _disposed = false;

    public RoundedCorner(ViewContext viewContext)
    {
        _viewContext = viewContext;
    }

    public void Dispose()
    {
        Dispose(true);
        GC.SuppressFinalize(this);
    }

    protected virtual void Dispose(bool disposing)
    {
        if (!_disposed)
        {
            _disposed = true;
            _viewContext.Writer.Write(
                @"<div class=""Clear"">
                  </div>
                  </div>
                  </div>
                  <div class=""bottom"">
                  <div class=""right"">
                  </div>
                  </div>
                  </div>
                  </div>"
            );
        }
    }
}

public static class HtmlExtensions
{
    public static RoundedCorner RoundedCorner(this HtmlHelper htmlHelper)
    {
        htmlHelper.ViewContext.Writer.Write(
            @"<div class=""rounded"">
            <div class=""top"">
            <div class=""right"">
            </div>
            </div>
            <div class=""middle"">
            <div class=""right"">
            <div class=""content"">"
        );
        return new RoundedCorner(htmlHelper.ViewContext);
    }
}

在您看来简单地说：

@using (Html.RoundedCorner())
{
    <div>Some how allow me to insert data into here</div>
}

会生成(我知道,这是一个丑陋的格式但是完全有效的HTML,我现在懒得修复它)：

<div class="rounded">
                <div class="top">
                <div class="right">
                </div>
                </div>
                <div class="middle">
                <div class="right">
                <div class="content">    <div>Some how allow me to insert data into here</div>

<div class="Clear">
                  </div>
                  </div>
                  </div>
                  <div class="bottom">
                  <div class="right">
                  </div>
                  </div>
                  </div>
                  </div>

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!