在jQuery中獲取錨標記值

Question

我有一個這樣的html標簽。

<a class="employee_details" target="_blank" href="index1.php?name=user1&id=123">User</a>

我需要在jQuery中獲取兩個參數值

<script type="text/javascript">
    $(function () {
        $('.employee_details').click(function () {
            var status_id = $(this).attr('href').split('name');
            alert(status_id[0]);
        });
    });
</script>

在javascript中獲取兩個變量中的兩個參數值的任何幫助。

我想使用jQuery在兩個變量中獲取user1和123

謝謝金茲

Answer 1

嘗試以下邏輯：

var href = $(this).attr('href');
var result = {};
var pars = href.split("?")[1].split("&");

for (var i = 0; i < pars.length; i++)
{
    var tmp = pars[i].split("=");
    result[tmp[0]] = tmp[1];
}

console.log(result);

因此，您將獲得參數作為result對象的屬性，例如：

var name = result.name;
var id = result.id;

小提琴 。

更新：

對於無法理解這一點的投票者，請使用以下已實現的版本：

var getParams = function(href)
{
    var result = {};
    var pars = href.split("?")[1].split("&");

    for (var i = 0; i < pars.length; i++)
    {
        var tmp = pars[i].split("=");
        result[tmp[0]] = tmp[1];
    }

    return result;
};

$('.employee_details').on('click', function (e) {
    var params = getParams($(this).attr("href"));
    console.log(params);

    e.preventDefault();
    return false;
});

小提琴 。

Answer 2

$(function() {
    $('.employee_details').on("click",function(e) {
        e.preventDefault(); // prevents default action
        var status_id = $(this).attr('href');
        var reg = /name=(\w+).id=(\w+)/g;
        console.log(reg.exec(status_id)); // returns ["name=user1&id=123", "user1", "123"]
    });
});

// [0] returns `name=user1&id=123`
// [1] returns `user1`
// [2] returns `123`

JSFiddle

注意：最好使用ON方法而不是單擊

Answer 3

不是最跨瀏覽器的解決方案，但可能是最短的解決方案之一：

$('.employee_details').click(function() {
    var params = this.href.split('?').pop().split(/\?|&/).reduce(function(prev, curr) {
        var p = curr.split('=');
        prev[p[0]] = p[1];
        return prev;
    }, {});

    console.log(params);
});

輸出：

Object {name: "user1", id: "123"}

如果您需要IE7-8支持，則此解決方案將不起作用，因為這里沒有Array.reduce 。

Answer 4

$(function () {
    $('.employee_details').click(function () {
        var query = $(this).attr('href').split('?')[1];
        var vars = query.split('&');
        for (var i = 0; i < vars.length; i++) {
            var pair = vars[i].split('=');
            var varName = decodeURIComponent(pair[0]);
            var varValue = decodeURIComponent(pair[1]);
            if (varName == "name") {
                alert("name = " + varValue);
            } else if (varName == "id") {
                alert("id = " + varValue);
            }
        }            
    });
});

Answer 5

它不是很優雅，但是在這里！

var results = new Array();
var ref_array = $(".employee_details").attr("href").split('?');
if(ref_array && ref_array.length > 1) {
    var query_array = ref_array[1].split('&');
    if(query_array && query_array.length > 0) {
        for(var i = 0;i < query_array.length; i++) {
            results.push(query_array[i].split('=')[1]);
        }
    }
}

results具有值。 這應該適用於其他類型的url查詢。

Answer 6

很簡單

// function to parse url string
function getParam(url) {
    var vars = [],hash;
    var hashes = url.slice(url.indexOf('?') + 1).split('&');
    for (var i = 0; i < hashes.length; i++) {
        hash = hashes[i].split('=');
        vars.push(hash[0]);
        vars[hash[0]] = hash[1];
    }
    return vars;
}

// your code
$(function () {
    $('.employee_details').click(function (e) {
        e.preventDefault();
        var qs = getParam($(this).attr('href'));
        alert(qs["name"]);// user1
        var status_id = $(this).attr('href').split('name');
    });
});