將超鏈接放入腳本

Question

我不知道這里到底是什么問題，但我需要將電話號碼、網站和電子郵件變成超鏈接，我真的不知道從哪里開始。

我在使用錨標記之前嘗試了一些東西，但沒有奏效。 信息存儲在我的 SQL 表中，並由 PHP 腳本訪問，該腳本允許此腳本使用數據，只需要建立必要的鏈接。

function geo() {
    var id = $.QueryString("id"),
        id = (!id) ? "null" : id; // Passing the value null to string
    var loadUrl = 'http://localhost/test/detail.php';
    $.getJSON('http://localhost/test/detail.php?id=' + id, function (data) {
        $.each(data, function (key, val) {
            if (val.Image != "" && val.Image != null) {
                $('#placePic').attr('src', 'images/' + val.Image);
            } else {
                $('#placePic').attr('src', 'images/default_image2.jpg');
            }
            if (val.Name != "" && val.Name != null) {
                $('#placeName').text(val.Name);
            }
            $("#list_All").html("");
            if (val.PhoneNumber != "" && val.PhoneNumber != null) {
                $("#list_All").append("<li><h3>Phone Number :</h3>" + val.PhoneNumber + "</li>");
            } else {
                $("#list_All").append("<li><h3>Phone Number :</h3>No Data Found</li>");
            }
            if (val.Address != "" && val.Address != null) {
                $("#list_All").append("<li><h3>Address :</h3>" + val.Address + "</li>");
            } else {
                $("#list_All").append("<li><h3>Address :</h3>No Data Found</li>");
            }
            if (val.Email != "" && val.Email != null) {
                $("#list_All").append("<li><h3>Email ID :</h3>" + val.Email + "</li>");
            } else {
                $("#list_All").append("<li><h3>Email ID :</h3>No Data Found</li>");
            }
            if (val.Website != "" && val.Website != null) {
                $("#list_All").append("<li><h3>Website :</h3>" + val.Website + "</li>");
            } else {
                $("#list_All").append("<li><h3>Website :</h3>No Data Found</li>");
            }
            $("#pom_btn").attr("href", "http://localhost/test/on_map.html?id=" + val.userId + "&lat=" + val.Lat + "&lon=" + val.Lon);
        });
    });
}
window.onload = function () {
    geo();
}

Answer 1

試試這個：

function geo() {
    var id = $.QueryString("id"),
        id = (!id) ? "null" : id; // Passing the value null to string
    var loadUrl = 'http://localhost/test/detail.php';
    $.getJSON('http://localhost/test/detail.php?id=' + id, function (data) {
        $.each(data, function (key, val) {
            if (val.Image != "" && val.Image != null) {
                $('#placePic').attr('src', 'images/' + val.Image);
            } else {
                $('#placePic').attr('src', 'images/default_image2.jpg');
            }
            if (val.Name != "" && val.Name != null) {
                $('#placeName').text(val.Name);
            }
            $("#list_All").html("");
            if (val.PhoneNumber != "" && val.PhoneNumber != null) {
                $("#list_All").append("<li><h3>Phone Number :</h3>" + 
                    "<a href='tel:" + val.PhoneNumber + "'>" + val.PhoneNumber + "</a></li>");
            } else {
                $("#list_All").append("<li><h3>Phone Number :</h3>No Data Found</li>");
            }
            if (val.Address != "" && val.Address != null) {
                $("#list_All").append("<li><h3>Address :</h3>" + val.Address + "</li>");
            } else {
                $("#list_All").append("<li><h3>Address :</h3>No Data Found</li>");
            }
            if (val.Email != "" && val.Email != null) {
                $("#list_All").append("<li><h3>Email ID :</h3>" 
                    "<a href='mailto:" + val.Email + "'>" + val.Email + "</a></li>");
            } else {
                $("#list_All").append("<li><h3>Email ID :</h3>No Data Found</li>");
            }
            if (val.Website != "" && val.Website != null) {
                $("#list_All").append("<li><h3>Website :</h3>" + 
                    "<a href='" + ((val.Website.indexOf("http")!=0)?"http://":"") + val.Website +
                    "'>" + val.Website + "</a></li>");
            } else {
                $("#list_All").append("<li><h3>Website :</h3>No Data Found</li>");
            }
            $("#pom_btn").attr("href", "http://localhost/test/on_map.html?id=" + val.userId + "&lat=" + val.Lat + "&lon=" + val.Lon);
        });
    });
}
window.onload = function () {
    geo();
}

對於網站鏈接，您需要在其前面加上“http://”或“https://”。 我做了一個簡單的測試，但根據您的情況可能需要更完整的測試。

Answer 2

 $("#list_All").append("<li><a href='" + val.Website + "'>Website</a></li>");

Answer 3

僅打印地址並不能使其成為超鏈接。 你必須有一個錨標簽包裹在它周圍。

例如：

$("#list_All").append("<li><h3>Website :</h3><a href='" + val.Website + "'>" + val.Website + "</a></li>");