仅显示等效于屏蔽输入（javascript）

在我们的web应用程序的各个地方，我们有以下内容

@Html.TextBoxFor(m => gridRow.data.IdExternal, new { @class = "ref-format" })

其中ref格式的定义如下：

<script src="../../../../Scripts/jquery.maskedinput-1.2.2.js"  type="text/javascript"> </script>
<script type="text/javascript">
    $(".ref-format").mask("99/99/99999", { placeholder: "n" });
</script>

---

最后我编写了一个扩展方法来进行格式化，并使用@Html.Raw

<div class="display-field highlight01">@Html.Raw(Model.Token.Reference.FormattedReference())</div> 

@Html.Raw（Model.Token.Reference.FormattedReference（））

只是一个想法，为什么不屏蔽输入框中的值，然后应用css样式，使其看起来像标签？我相信屏蔽只在输入元素上可能，而在容器元素的内部文本上不可能。我尝试了以下代码，它执行了屏蔽

<div class="display-field highlight01 ref-format">
    000700882
</div>

div.display-field {
    display: inline;
    float: left;
    max-width: 70%;
    width: 69%;
    padding-bottom: 0.5em;
    padding-right: 0.5em;
}

<div class="display-field highlight01">@Html.Raw(Model.Token.Reference.FormattedReference())</div>