2016-06-28 15 views
1

私はWebワーカーにいくつかのURLポーリング要求をオフロードする作業を進めています。これを行うには、invokationのDOM要素から特定の属性を取得し、URL要求に渡してから元のDOM要素を結果に更新する必要があります。複数のDOM要素がこの関数を使用して更新を取得するため、正しい要素が確実に更新されるように、$(this)または同等の一意の識別子を渡す必要があります。WebワーカーによるjQuery参照の受け渡し

私は"Passing objects to a web worker""Can I pass a jQuery object to a web worker"のような質問から理解できませんので、私はこれをエミュレートする手段を探しています。あなたが見ることができるように、私は、Webワーカーの内側$(this)にアクセスする必要はありませんが、リクエストが順番に戻った後、私は参照が必要

//main.js 
function update(){ 
    var data = { 'id'  : $(this).attr('itemid'), 
       'filter' : $(this).attr('filter')} 
    updatePoller.postMessage(data); 
} 

//worker.js 
this.onmessage = function(e){ 
    //format params from e.data 
    //make GET request to url 
    //when done... 
    postMessage(req.responseText); 
} 

//main.js (again) 
updatePoller.onmessage = function(message){ 
    //process response 
    //update child elements of $(this) 
} 

:ここ

は、私のコードの大まかな概要であります正しい要素を更新します。 WebワーカーからDOM要素への一意の参照を渡す方法はありますか?

答えて

1

参照を使用できない場合に要素を一意に識別する通常の方法は、idを使用することです。あるいは、data-*属性を使用できますが、実際にはidがこの特定の目的のために作成されています。だから、

(コメントを参照してください):

//main.js 
var lastId = 0; 
function update(){ 
    // Assign ID if necessary 
    if (!this.id) { 
     ++lastId; 
     this.id = "__auto" + lastId; 
    } 
    var data = { 'id'  : $(this).attr('itemid'), 
       'filter' : $(this).attr('filter'), 
       'elementId': this.id} 
    updatePoller.postMessage(data); 
} 

//main.js (again) 
updatePoller.onmessage = function(message){ 
    // Use the `element` value sent back to look it up by ID: 
    $("#" + message.data.elementId).xyz(); 
} 

id値は自動グローバルを作成するため)、それらの自動グローバルのすべてを持つ場合には、あなたを悩ますことで行われたとき、あなたはIDを削除できます。

//main.js (again) 
updatePoller.onmessage = function(message){ 
    var elm = $("#" + message.data.elementId); 
    if (elm.attr("id").startsWith("__auto")) { // auto ID? 
     elm.attr("id", "");      // remove it 
    } 
    elm.xyz(); 
} 

以下jQueryを使って:

//main.js (again) 
updatePoller.onmessage = function(message){ 
    var elm = $("#" + message.data.elementId)[0]; 
    if (elm && elm.id.startsWith("__auto")) { 
     elm.id = ""; 
    } 
    $(elm).xyz(); 
} 
+0

おかげで、私は 'に' $(この)の 'id'を渡すために管理作業者に応答と要素IDを持つJSONオブジェクトを返す –

関連する問題