Javascript“加载”事件未按预期运行

时间:2018-08-27 04:58:30

标签: javascript events javascript-events event-handling domcontentloaded

我想在显示按钮后(即页面加载后)显示警报。

<input type='button' id='lognBtn' value='btn' />
<script>
    window.addEventListener("load", function(){ alert(20); });
</script>

使用此代码,页面加载前会显示警报。我也尝试了DOMContentLoaded。请帮忙。

5 个答案:

答案 0 :(得分:1)

它按预期方式工作...只是警报是浏览器的阻止事件,您必须单击它才能继续。您可以从下面的示例中看到,尽管按钮本身“显示”,但警报仍显示按钮的值:

<input type='button' id='lognBtn' value='helloBtn'/>
<script>
    window.addEventListener("load", function(){ 
	alert(document.getElementById('lognBtn').value) 
    });
</script>

您可以在按钮上切换到事件处理程序,也可以使用setTimeout as shown here

答案 1 :(得分:1)

您可以使用setTimeout()方法创建页面加载后调用警报的延迟时间

window.onload = function(){ 
 if(document.getElementById("demo")){
   setTimeout(function(){ alert("Hello"); }, 1000);
 }
} 
<!DOCTYPE html>
<html>
<body>
<button id="demo"></button>
</body>
</html>

答案 2 :(得分:0)

这就像在HTML中交换Installing package into ‘/home/arvcondor/R/x86_64-pc-linux-gnu-library/3.4’ (as ‘lib’ is unspecified) trying URL 'https://cloud.r-project.org/src/contrib/udunits2_0.13.tar.gz' Content type 'application/x-gzip' length 67182 bytes (65 KB) ================================================== downloaded 65 KB * installing *source* package ‘udunits2’ ... ** package ‘udunits2’ successfully unpacked and MD5 sums checked checking for gcc... gcc -std=gnu99 checking whether the C compiler works... yes checking for C compiler default output file name... a.out checking for suffix of executables... checking whether we are cross compiling... no checking for suffix of object files... o checking whether we are using the GNU C compiler... yes checking whether gcc -std=gnu99 accepts -g... yes checking for gcc -std=gnu99 option to accept ISO C89... none needed checking for XML_ParserCreate in -lexpat... no checking how to run the C preprocessor... gcc -std=gnu99 -E checking for grep that handles long lines and -e... /bin/grep checking for egrep... /bin/grep -E checking for ANSI C header files... yes checking for sys/types.h... yes checking for sys/stat.h... yes checking for stdlib.h... yes checking for string.h... yes checking for memory.h... yes checking for strings.h... yes checking for inttypes.h... yes checking for stdint.h... yes checking for unistd.h... yes checking udunits2.h usability... no checking udunits2.h presence... no checking for udunits2.h... no checking for ut_read_xml in -ludunits2... no -----Error: libudunits2.a not found----- If the udunits2 library is installed in a non-standard location, use --configure-args='--with-udunits2-lib=/usr/local/lib' for example, or --configure-args='--with-udunits2-include=/usr/include/udunits2' replacing paths with appropriate values for your installation. You can alternatively use the UDUNITS2_INCLUDE and UDUNITS2_LIB environment variables. If udunits2 is not installed, please install it. It is required for this package. ERROR: configuration failed for package ‘udunits2’ * removing ‘/home/arvcondor/R/x86_64-pc-linux-gnu-library/3.4/udunits2’ Warning in install.packages : installation of package ‘udunits2’ had non-zero exit status The downloaded source packages are in ‘/tmp/RtmpzhtzSg/downloaded_packages’ <script>的顺序一样简单:

<input/>

通常,无论如何我都建议使用<script> document.addEventListener("DOMContentLoaded", function() { alert(20); }); </script> <input type='button' id='lognBtn' value='btn' /> 。有关此事件的更多信息,see the MDN documentation

答案 3 :(得分:0)

解决方案非常简单。您正在使用Name A,,, ,Name B,, ,, Name C,Value C ,, Name D,Value D ,,Name E,Value E ,因此浏览器将在页面加载后立即显示它。只需像这样将其更改为load,您就会在单击按钮后得到警报,因此可以控制何时应显示警报,并为按钮在警报之前的渲染提供时间。

click

答案 4 :(得分:-1)

您可以使用return_sequence=True事件。实际上,警报是在DOM加载后显示的,但是在按钮显示后您无法检测到差异,然后警报就出来了。您可以使用window.onload 1秒钟。

setTimeout
window.onload = function(){
  setTimeout(function(){ alert(20)},1000);
}