Jquery mailto/tel:onchange

我有一个下拉菜单，它从foreach循环中获取数据。数据被放入数据属性中，我试图用这些属性填充两个图标。以下是我对此的看法：

<div class="row contact-full-container">
<div class="container">
    <div class="col-xs-12">

        <div class="panel panel-contact-full">
            <div class="panel-body">
                <div class="col-sm-5 form-group">
                    <h3>@Model.InformationText</h3>
                    <label class="sr-only" for="contact-select"></label>
                    <div class="form-select">
                        <select class="form-control" id="contact-select" title="Choose area" name="">
                            @foreach (var contact in Model.ContactContentArea.ContentItems<ContactBlock>())
                            {
                                <option data-phone="@contact.Phone" data-email="@contact.Email" data-image="@contact.Image">@contact.Name</option>
                            }
                        </select>
                        <i class="fa fa-caret-down"></i>
                    </div>
                </div>

                <div class="col-xs-8 col-xs-push-3 col-sm-4 col-sm-push-3">

                </div>
            </div>

            <div class="panel-footer">
                <div class="col-xs-5 col-sm-8 contact-icons">
                    <a href="tel:" id="phone-href"><i class="fa fa-lg fa-phone"></i></a>
                    <a href="mailto:" id="mail-href"><i class="fa fa-lg fa-envelope"></i></a>
                </div>
            </div>
        </div>
    </div>
</div>

当我运行我的站点时，这两个图标的值只是简单的“tel:”和“mailto:”，不管它是刚加载的还是我在下拉列表中实际更改了什么。有人能看出我的错误吗

试试这个
让我知道它是否有效

设置属性就像获取属性一样。只有您使用第二个值。 比如

$（this）.attr（'test'，'Data i want to put in test'）

$（'#联系人选择'）。更改（功能（）{
//不知道这些2.从来没有这样用过。
var email=$（this）.children（'option:selected'）.data（'data-email'）；//试试这个

让我知道它是否有效

设置属性就像获取属性一样。只有使用第二个值。
比如
$（this）.attr（'test'，'Data i want to put in test'）

$（'#联系人选择'）。更改（功能（）{
//不知道这些2.从来没有这样用过。
var email=$（this）.children（'option:selected'）.data（'data-email'）；//以上答案几乎正确。如果使用data（），则不需要将数据放在电子邮件、电话等前面

$('#contact-select').change(function () {
        var email = $(this).children('option:selected').data('email'); 
        var phone = $(this).children('option:selected').data('phone');

$('#phone-href').attr('href', 'tel:' + phone);
$('#mail-href').attr("href", "mailto:" + email);
        //  set phone-href to phone - mind phone:
        //  set email-href to email - mind email:
});

上面的答案几乎是正确的。如果你使用data（），你不需要把数据放在电子邮件、电话等前面

$('#contact-select').change(function () {
        var email = $(this).children('option:selected').data('email'); 
        var phone = $(this).children('option:selected').data('phone');

$('#phone-href').attr('href', 'tel:' + phone);
$('#mail-href').attr("href", "mailto:" + email);
        //  set phone-href to phone - mind phone:
        //  set email-href to email - mind email:
});

干杯，小伙子。我以前可能让它工作过，但我意识到我的解决方案没有正确运行jquery库。干杯，小伙子。我以前可能让它工作过，但我意识到我的解决方案没有正确运行jquery库。
$('#contact-select').change(function () {
        var email = $(this).children('option:selected').data('email'); 
        var phone = $(this).children('option:selected').data('phone');

$('#phone-href').attr('href', 'tel:' + phone);
$('#mail-href').attr("href", "mailto:" + email);
        //  set phone-href to phone - mind phone:
        //  set email-href to email - mind email:
});