在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中的兩個變量得到兩個參數值任何幫助這兩個參數值。

我想user1和兩個變量123使用jQuery

感謝 Kimz

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; 

Fiddle。

UPDATE：

對於向下選民誰不能undertand此，一個實現版本：

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; 
}); 

Fiddle。

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

$(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 4

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

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有值。這應該適用於其他種類的網址查詢。

Answer 5

它是如此簡單

// 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'); 
    }); 
}); 

Answer 6

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

$('.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。