web-dev-qa-db-ja.com

jqueryのhrefからパラメータ値を取得します

スクリプト

 <a href="#?cat=MT&typ=1" data-reveal-id="reveal_popup" onclick="pop();" data-closeonbackgroundclick="false" data-dismissmodalclass="close-reveal-modal">due today</a>
 <a href="#?cat=MT&typ=2" data-reveal-id="reveal_popup" onclick="pop();" data-closeonbackgroundclick="false" data-dismissmodalclass="close-reveal-modal">due in 2 days</a>

 <div id="reveal_popup" class="reveal-modal">
 <div id="popup"></div>
 <a class="close-reveal-modal">&#215;</a>
 </div>

function pop() {

 var cat=**value of cat parameter in href**
 var type=**value of typ parameter in href**

 $.ajax({
       type:'post',
       url:site_url()+'/event/deleteEventSingle',
       data:{'cat':cat,'type':typ},
        async:false,
         success:function(result){}
        });
}

これでは、ユーザーがhrefをクリックすると、同じポップアップが異なるデータとともに表示されます。実際には10を超えるhrefがあり、ポップアップにユーザーが入力したデータを含むカレンダーを表示しようとしています。これは、hrefに示すように、2つのパラメーターcatとtypに依存します。

要件

すべてのhrefには、独自のcatとtypの値があります。 hrefがクリックされたときに、クリックされたhrefのcat値とtyp値がjqueryを使用して取得されるようにし、これらの変数をajaxで渡すことができるようにします。

var cat=**value of cat parameter in href**
var type=**value of typ parameter in href**

試した

クリックイベントオブジェクトからリンクのhref属性のパラメータを取得する方法

9
Avinash

あなたは以下のようにsoemeのことをすることができます

$('a').bind('click',function(){
    var url = ($(this).attr('href'));
    var cat = getURLParameter(url, 'cat');
    var typ = getURLParameter(url, 'typ');
    //calling the ajax function
    pop(cat, typ)
});


function getURLParameter(url, name) {
    return (RegExp(name + '=' + '(.+?)(&|$)').exec(url)||[,null])[1];
}

function pop(cat, typ) {

    $.ajax({
       type:'post',
       url:site_url()+'/event/deleteEventSingle',
       data:{'cat':cat,'type':typ},
        async:false,
         success:function(result){}
    });
}

ライブフィドルの例をチェックしてください http://jsfiddle.net/mayooresan/aY9vy/

12
Jay Mayu

これを試して :

function getUrlParams(url) {
    var params = {};
    url.substring(1).replace(/[?&]+([^=&]+)=([^&]*)/gi,
            function (str, key, value) {
                 params[key] = value;
            });
    return params;
}

使用法:

function pop(e) {
     var url = $(e.target).attr("href");
     var params = getUrlParams(url); 

     var cat= params["cat"];
     var type= params["typ"];

     alert(cat);
     alert(type);    
}

Working Fiddle

7
Gaurav