定制事件觸發的ajax調用保留了先前調用的數據

Question

早上好，我在jquery中開發的跟蹤系統遇到了問題。 這背后的主要思想是使處理程序綁定到許多可以單擊的元素，一旦單擊該處理程序，將獲取一個代碼，將被單擊的元素視為代碼，並對記錄該代碼和時間的php腳本進行ajax調用。

這很好，但突然我意識到頁面上的元素通常沒有任何ID，名稱或類（或具有任意元素），這些是我想要“跟蹤”的屬性。 因此，由於大多數情況下，這些匿名頁面元素都具有處理其行為的javascript，因此我想到了一個事件觸發器，以將應觸發我的跟蹤javascript的那些javascript放入其中。

我的問題的部分原因是這些頁面，JavaScript等中的大多數都是不可觸摸的，因此我將這種跟蹤功能與觸摸任何東西（或幾乎所有東西）集成在一起。

現在，一些代碼，這是ajax調用本身：

function XJAX(strUrl,kpi,isAsync) {

        if (isAsync == "true") {isAsync = true;} else {isAsync = false;}
        console.log("xjax called");
        xhr = $.ajax({
            url: strUrl,
            type: 'GET',
            cache:false,
            data: { kpiName: kpi },
            contentType: "application/json; charset=utf-8",
            dataType: "jsonp",
            jsonp: "callback",
            jsonpCallback: "callbackLog",
            async:isAsync
        });

        if(isAsync == false){
            setTimeout(function(){
                try{
                    xhr.abort();
                    console.log("xhr aborted");
                }catch(e){}

            },800);
        }       
    }

這是一個jsnop結構，用於從中獲取一些數據：

kpiList = $.parseJSON('{"idkpi":{"termkk":{"kpi":"id1111termkk","asynk":"true"}, "termww":{"kpi":"id2222termww","asynk":"false"}, "secondClick":{"kpi":"id8888secondClick","asynk":"true"}, "firstClick":{"kpi":"id7777firstClick","asynk":"false"} }, "classkpi":{"birms":{"kpi":"cl3333","asynk":"false"},"gurp":{"kpi":"cl4444","asynk":"true"} },"namekpi":{"genericLink":{"kpi":"na55555","asynk":"false"},"anotherThing":{"kpi":"na66666","asynk":"true"} }}');

現在，我編寫了此處理程序，該處理程序應跟蹤自定義事件：

$(document).bind('trackme',function(eventFire,elementToBeTracked){
        console.log('track ' + elementToBeTracked);
        kpiN = false;
        asynk = true;
        try{
            kpiN = kpiList["idkpi"][elementToBeTracked]["kpi"];
            asynk = kpiList["idkpi"][elementToBeTracked]["asynk"];  
            if (!kpiN){
                kpiN = kpiList["namekpi"][elementToBeTracked]["kpi"];
                asynk = kpiList["namekpi"][elementToBeTracked]["asynk"];    
            }

            if (!kpiN){
                kpiN = kpiList["classkpi"][elementToBeTracked]["kpi"];
                asynk = kpiList["classkpi"][elementToBeTracked]["asynk"];   
            }

            if((typeof kpiN !== 'undefined') && (kpiN !== '')){
                XJAX(url,kpiN,asynk);   
            }   
        }catch(e){}
});

在這種情況下：

<button id="first" type="button">first click</button>
<button id="start" style="display:none" type="submit">second click</button>




$(document).ready(function(){
            $('#first').click(function() {
                $(document).trigger( "trackme",  "firstClick"  );
                $('#first').hide();
                $('#start').show()
            });
            $('#start').click(function() {
                $(document).trigger( "trackme",  "secondClick"  );                
            });

        });

發生這種情況：第一次單擊將完全觸發該調用，而ajax調用將觸發遠程腳本，並且所有內容均以“ firstClick”的名稱記錄。

第二次單擊，從第一次調用返回一些參數，返回一個空對象，然后記錄正確的調用，但是沒有執行任何調用，也返回一個空對象。

--------first click is done-------------
track firstClick 
Object {readyState: 1, setRequestHeader: function, getAllResponseHeaders: function, getResponseHeader: function, abort: function…} <---- this is a full object, all works fine
xjax called 
Resource interpreted as Script but transferred with MIME type text/html: "a server"
xhr aborted 
-----------end---------------

----------second click--------
xjax called
Object {readyState: 1, setRequestHeader: function, getAllResponseHeaders: function, getResponseHeader: function, abort: function…} <---- empty object

track secondClick
xjax called 
Object {readyState: 1, setRequestHeader: function, getAllResponseHeaders: function, getResponseHeader: function, abort: function…} <---- empty object
---------end------------------

在另一個文件（日志）上，我發現兩次單擊的ID是第一次單擊的ID，而從來沒有第二次單擊。

“異常中止”的事情是我試圖處理同步調用和瀏覽器阻塞的事情，這樣我就給了機會而不會阻塞太多。

奇怪的是，第二個調用保留了第一個調用的一些數據，其行為與沒有觸發功能的xjax調用時的行為不同。

應該和事件有關嗎？ 我的意思是，一旦trigger()它，也許我必須重置該處理程序？

有人對此有想法嗎？

Answer 1

據我所知（這是一個隨機的故事），您正在尋找id，名稱或類。 將它們放在變量中，如果按下，則發出AJAX調用。 您的問題是：為什么要返回任意名稱和其他數據。

可能是類不是唯一的。 因此，當您調用一個類時，它可以被共享並因此請求另一個。 它將解釋任意名稱，使您看到請求的類而又不知道需要哪一個（據我所知）。

您最好添加一個數據trackid。 這樣，您可以控制id是什么，並且您始終可以返回所需的ID。 甚至更多，它是唯一的，這就是跟蹤的全部意義。