2015-04-23 5 views
1

У меня есть яваскрипт функция, например:Выполнить функцию, когда элемент оказывается

function SuperTD(id,str,tooltip) { 
    return '<td id="' +id+ '" title="' +tooltip+ '">' +str+ '</td>'; 
} 

SuperTD называется и сцепляются со многими элементами, и я не хочу, чтобы изменить то, как он работает (в образующий элемент без используя строку html).

И мне нужно, чтобы вызвать функцию, когда что элементы визуализируются, например:

function SuperTD(id,str,tooltip) { 
    var onwhat = 'onwhat="executeFixedFunction(' + "'" +id+ "'" + ')"'; 
    return '<td><div id="' +id+ '" title="' +tooltip+ '" ' +onwhat+ '>' +str+ '</div></td>'; 
} 

где executeFixedFunction является:

function executeFixedFunction(id) { 
    $('#' + id).uploadFile({ 
    url:"/file/upload" 
    }); 
} 

, что правильное событие, чтобы сделать это? Мне нужно инициализировать элемент file-upload всюду SuperTD под названием

Пользователи по-прежнему используют Firefox 3.5.

EDIT больше контекста:

GridBuilder.render = function() { 
    // return from cache 
    var html = ''; 
    // calls html += SuperTD(...) 
    return html; 
} 

GridBuilder.renderTo = function(id) { 
    $('#'+id).html(this.render()); 
    // I guess this is where I should initialize the file upload, but still, is there another way? 
} 
+2

Вы можете использовать [ 'MutationObserver'] (https://developer.mozilla.org/en/docs/Web/API/MutationObserver), но это очень сложно. Я предлагаю вам изменить функцию 'SuperTD', чтобы инициализировать загрузку файла (что имеет большее значение), чем использовать наблюдателя. – DontVoteMeDown

+1

https://developer.mozilla.org/en-US/docs/Web/Guide/Events/Creating_and_triggering_events –

+1

В качестве альтернативы вы можете добавить параметр обратного вызова в определение функции. 'function (id, str, tooltip, callback) {callback();}' –

ответ

3

Если вы уже используете JQuery я бы рассмотреть возможность сделать это следующим образом:

function superTD (id, str, tooltip) { 
    return $('<td/>', { 
    id: id, 
    title: tooltip, 
    text: str 
    }).uploadFile({ 
    url: '/your-url' 
    }) 

} 

Тогда вы можете вызвать appendTo метод на superTD, чтобы вставить его в строку таблицы

2

Вы можете использовать функцию SetTimeout задержать функцию обратного вызова.

function SuperTD(id,str,tooltip) { 
    var onwhat = 'onwhat="executeFixedFunction(' + "'" +id+ "'" + ')"'; 
    setTimeout(function(){ executeFixedFunction(id) }, 1000); 
    return '<td><div id="' +id+ '" title="' +tooltip+ '" ' +onwhat+ '>' +str+ '</div></td>'; 
} 
+1

Это ненадежность. –

1

Все вместе взятые с слегка модифицированное предложение Якуба. См. На странице Plunkr.

function superTD(id, str, tooltip, callback) { 
    var td = $('<td/>', { 
     id: id, 
     title: tooltip, 
     text: str 
    }); 

    var up = $('<span/>'); // <-- this elm will be replaced 
    td.append(up); 
    $('#container').append(td); 

    callback(up, str); 
} 

function onCreated(elm, fname) { 
    elm.uploadFile({ 
     url: '/url', 
     fname: fname 
    }); 
} 

$(document).ready(function() { 
    superTD(1, 'foo', 'bar', onCreated); 
    superTD(2, 'bar', 'foo', onCreated); 
}); 
Смежные вопросы