Google chrome javascript loaded via ajax only runs after first click

Question

I got a very odd problem which only happens on google chrome. Due to the size of the project i cannot really supply a test-case (believe me i tried). The problem is that after loading some html (containing scripts) into a container with an ajax call like this:

var fillView = function(data) {
    viewElement.html(data);
}

$.ajax({
    url: gridUrl + 'update/id/' + rowData.id + gridUrlParams,
    success: fillView
});

...all the javascript that was in data does not get executed in google chrome until i click onto the document . This goes for several different plugins bound to input fields in a form. I can't observe (or reproduce, for that matter) any such effect in any other browser, nor did i add any code that would do something like that.

I tried for hours to get to the core of this, removing the first half of the affected input fields, then the other half, then portions of it.. only to have this happen to whatever remains. I also tried stripping down/commenting out most of the other javascript i didn't need (which shouldn't and wasn't called) for the current site.

There seems to be a rather obvious "fix" that isn't a fix and also only sometimes works. in case you didn't guess it ;):

setTimeout("$('#form').trigger('click')",50);

Funny/Odd Detail:

If i add alert("test"); to the javascript, it get's executed right at page load, but stuff affecting the UI does not until the first click anywhere in the browser.

$% & §$}$!!!!

UPDATE:

adding the following:

    $('.field-block').css('background-color','#000');

to the result of the ajax call, also does nothing until i click inside the browser window.

"My Latin ends here." Has anyone ever heard of this, seen it or has an idea what i could try to fix this pesky problem.

Answer 1

问题是受影响的输入周围有一个细节标签。.firefox和其他组件中的polyfill效果很好，从本质上看，它们尚未准备好用于生产。