使用Javascript的Chrome浏览器的奇怪行为

Question

我想要一些代码行。为什么Mozilla Firefox首先保存图片（），Chrome取秒 saveImage。即使console.log（$（'＃param-form'）。size（））= 0 ??? 我使用Jquery 1.7.2。长度代替大小（）它是相同的结果。

$(document).ready(function(){ 
    if ($('#catalog-image-form').size()) { 
     function saveImage() { 
      some logic 1 
     } 
    } 

    if ($('#param-form').size()) { 
     function saveImage() { 
     some logic 2 
     } 
    } 
}); 

Answer 1

除了Jaroslaw所说的.size（）方法被弃用为jQuery 1.8之外，你有没有尝试过？

if ($('#param-form').size() > 0) 

你测试2个不同的选择器，你确定Chrome不会同时执行saveImage（）吗？

Answer 2

也许这是一个问题function hoisting？

Answer 3

在脚本加载时，Chrome应搜索全部全部函数声明以声明的顺序优化/预编译代码内部。

如果您在运行时声明函数，则使用=函数，只有在执行该行时才执行声明。

因此，在你的情况下，在运行时定义函数saveImage = function（）{...}。

$(document).ready(function(){ 
 
    if ($('#catalog-image-form').size()) { 
 
     saveImage = function() { 
 
      $("#input1").val("some logic 1"); 
 
     } 
 
     function globalfunction() { 
 
      $("#input1").val("some logic 1"); 
 
     } 
 
    } 
 

 
    if ($('#param-form').size()) { 
 
     saveImage = function() { 
 
     $("#input1").val("some logic 2"); 
 
     } 
 
     function globalfunction() { 
 
     $("#input2").val("some logic 2"); 
 
     } 
 
    } 
 

 
    if (false) { 
 
     saveImage = function() { 
 
     $("#input1").val("some logic 3"); 
 
     } 
 
     function globalfunction() { 
 
      $("#input2").val("some logic 3"); 
 
     } 
 
    } 
 
    
 
    saveImage(); 
 
    globalfunction(); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> 
 

 
<form id="catalog-image-form"> 
 
    <input type="text" name="input1" id="input1"/> 
 
    <input type="text" name="input2" id="input2"/> 
 
</form>