在 Razor 中显示 HTML 5 电话号码链接答案

【问题标题】：Display HTML 5 Telephone number link in Razor在 Razor 中显示 HTML 5 电话号码链接
【发布时间】：2013-12-13 01:44:57
【问题描述】：

我有以下问题：

我想在我的 HTML5 网页上有一个可点击的电话号码。通常我会简单地使用

<a href="tel: +123456789"> 123456789 </a>

但就我而言，我从数据库中获取号码并访问该号码。

现在代码行如下所示：

<a href=""> @Html.DisplayFor(modelItem => item.AD_Tel)</a>

如果不是固定号码，我如何让href 拨打该号码？

如果有不清楚的地方，请发表评论，我会补充缺失的信息。

【问题讨论】：

标签： c# asp.net asp.net-mvc html razor

【解决方案1】：

扩展@john-marston 的答案，扩展@Hutchonoid 的答案...

可以通过首先通过正则表达式运行数字来改进助手。这将删除通常添加到电话号码的任何+、(、)、- 或空格。一旦下降到原始数字，就可以添加 +，我们还确保它现在是唯一的。

var regEx = new Regex("[^0-9]");
var phoneNumber = regEx.Replace(data.Model.ToString(), "");
tb.Attributes.Add("href", $"tel:+{phoneNumber}");

另外，这是一个 .NET Core 版本

using System;
using System.Linq.Expressions;
using System.Text.Encodings.Web;
using System.Text.RegularExpressions;
using Microsoft.AspNetCore.Html;
using Microsoft.AspNetCore.Mvc.ViewFeatures.Internal;

namespace Microsoft.AspNetCore.Mvc.Rendering
{
    public static class HtmlHelpers
    {
        public static IHtmlContent TelephoneLinkFor<TModel, TValue>(this IHtmlHelper<TModel> helper, Expression<Func<TModel, TValue>> expression)
        {
            var data = ExpressionMetadataProvider.FromLambdaExpression(expression, helper.ViewData, helper.MetadataProvider);
            var tb = new TagBuilder("a");
            var regEx = new Regex("[^0-9]");
            var phoneNumber = regEx.Replace(data.Model.ToString(), "");
            tb.Attributes.Add("href", $"tel:+{phoneNumber}");
            tb.InnerHtml.Append("" + data.Model);

            var stringWriter = new System.IO.StringWriter();
            tb.WriteTo(stringWriter, HtmlEncoder.Default);
            var tagAsString = stringWriter.ToString();
            return new HtmlContentBuilder().SetHtmlContent(tagAsString);
        }
    }
}

仍然使用@Html.TelephoneLinkFor(x => x.PhoneNumber)实现

【讨论】：

【解决方案2】：

根据 hutchonoid 的回答：

    public static MvcHtmlString TelephoneLinkFor<TModel, TValue>(this HtmlHelper<TModel> helper, Expression<Func<TModel, TValue>> expression, object htmlAttributes = null)
    {
        var data = ModelMetadata.FromLambdaExpression(expression, helper.ViewData);            
        var tb = new TagBuilder("a");
        tb.Attributes.Add("href", string.Format("tel:+{0}", data.Model));
        tb.SetInnerText("" + data.Model);
        return new MvcHtmlString(tb.ToString());
    }

用法：@Html.TelephoneLinkFor(model => model.PhoneNumber)

【讨论】：

【解决方案3】：

你应该可以这样做：

<a href="tel:+@item.AD_Tel">@Html.DisplayFor(modelItem => item.AD_Tel)</a>

更新：

创建一个 HtmlHelper 扩展方法将允许您像这样使用您的视图：

 @Html.TelephoneLink("00000000000")

或

  @Html.TelephoneLink(item.AD_Tel)

扩展代码：

    public static MvcHtmlString TelephoneLink(this HtmlHelper htmlHelper, string telephoneNumber)
    {
        var tb = new TagBuilder("a");
        tb.Attributes.Add("href", string.Format("tel:+{0}", telephoneNumber));
        tb.SetInnerText(telephoneNumber);
        return new MvcHtmlString(tb.ToString());
    }

【讨论】：

【解决方案4】：

<a href="@Html.DisplayFor(modelItem => item.AD_Tel)"> 123456789 </a>

【讨论】：

这不起作用，因为现在它被认为是一个链接，而不是一个数字。

【解决方案5】：

你有没有试过先把电话号码放在一个变量里，然后放在href="HERE"里？？

【讨论】：

抱歉，这只是我能提供的所有信息……HTML 知识不是最好的……我会尽力给你答案，但需要一些时间；）