javascript 用于渲染元素的 jquery 事件
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/10292752/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jquery event for on render an element
提问by paul smith
I am trying to do all dom manipulations off screen and then make it visible. Which works, except now I have the situation where I am trying to do it with a form which I want to focus on the first input text upon rendering it on the browser.
Something like: myForm.prependTo(myDiv).show().find('input:first').focus();
Problem is that the focus is being called before the form has finished rendering which is causing the lovely error 'Can't move focus to the control because it is invisible, not enabled, or of a type that does not accept the focus'
How do other web developers handle the similiar situation of manipulating elements off screen and then making it visible? I wish jQuery had something likemyForm.prependTo(myDiv, function() { /* on render code here */ })
I know one way of doing it is setting a timeout and when it fires I put focus on the input, but I feel like that's not really the cleanest way to do things. I know the iframe has an onload event, so I'm curious if people usually draw their elements in some hidden iframe and listen for its load event to know when the element has finished rendering? If so could you point me to an example of doing this?
我正在尝试在屏幕外执行所有 dom 操作，然后使其可见。哪个有效，除了现在我尝试使用一个表单来完成它的情况，我想在浏览器上呈现它时专注于第一个输入文本。
类似于：myForm.prependTo(myDiv).show().find('input:first').focus();
问题是在表单完成渲染之前调用焦点，这导致了可爱的错误“无法将焦点移动到控件，因为它不可见、未启用或类型不接受焦点'
其他 Web 开发人员如何处理在屏幕外操作元素然后使其可见的类似情况？我希望 jQuery 有类似的东西myForm.prependTo(myDiv, function() { /* on render code here */ })
我知道一种方法是设置超时，当它触发时，我将注意力集中在输入上，但我觉得这并不是最干净的做事方式。我知道 iframe 有一个 onload 事件，所以我很好奇人们是否通常在一些隐藏的 iframe 中绘制他们的元素并监听它的 load 事件以了解元素何时完成渲染？如果是这样，你能指出我这样做的例子吗？
采纳答案by The Alpha
myForm.prependTo(myDiv).show(function(e){
$(this).find('input:first').focus();
});?
回答by webdunce
I know I'm 7 years late, but I had a similar problem, which I solved by putting the stuff I needed to happen after the render in a ready handler.
我知道我迟到了 7 年，但我遇到了类似的问题，我通过将渲染后需要发生的事情放在就绪处理程序中解决了这个问题。
I had a restore function that worked, but there was zero or near zero visual feedback that the element had been restored.
我有一个有效的恢复功能，但是元素已经恢复的视觉反馈为零或接近零。
I tried emptying the element first. It still worked, but still had zero visual feedback.
我先尝试清空元素。它仍然有效，但视觉反馈仍然为零。
$("#someSelector").empty();
restore();
$("#someSelector").empty();
restore();
Then I discovered ready() happens after the rendering; so I changed it to something like....
然后我发现 ready() 发生在渲染之后；所以我把它改成了……
$("#someSelector").empty().ready(function() {
restore();
});
$("#someSelector").empty().ready(function() {
restore();
});
Now the restore() doesn't happen until after the empty() action RENDERS. This means my element APPEARS to empty out and then refill (it always did, but now the user can see it happen).
现在restore() 直到empty() 操作RENDERS 之后才会发生。这意味着我的元素似乎要清空然后重新填充（它总是如此，但现在用户可以看到它发生了）。
I found this solution somehow a few days ago for a different problem with some vague search that I can't remember. Then I needed it again but couldn't exactly remember what I did. Now my searches included the word "jquery" and "render" and lead me here.
几天前我以某种方式找到了这个解决方案，用于解决一个我不记得的模糊搜索的不同问题。然后我再次需要它，但不记得我做了什么。现在我的搜索包括单词“jquery”和“render”并将我带到这里。
I ended up going thru my code to find out what I did, and I thought it might be a good idea to post it here in case other people stumble on this post and actually need to execute something AFTER rendering happens.
我最终通过我的代码找出我做了什么，我认为将它发布在这里可能是一个好主意，以防其他人偶然发现这篇文章并且实际上需要在渲染发生后执行某些操作。
Cheers.
干杯。
