Question

我正在编写一个处理HTMl页面中客户端事件的JS文件。 注册表单是这些事件之一，因此用户插入他的名字和密码，当点击提交按钮时，JS文件必须处理此事件。

var registerForm = document.getElementsByClassName('register-form');
registerForm[0].addEventListener('submit',function(e) {
      var username = document.getElementsByClassName('register-form-username')[0].value;
      var userpass = document.getElementsByClassName('register-form-pass')[0].value;
      var userDetails={
          name : username,
          pass: userpass
      };

      console.log(JSON.stringify(userDetails)); /*this is working and it print out on the console the same name and pass the user entered*/
      globalvar.register(userDetails);

    });

var globalvar= {
    register : function(userDetails) {   
        console.log(JSON.stringify(userDetails));  //this does not print in the console and it refreshes the page and reset the form fields 
        var x={
            comment : "", 
            userDetails: {
                name : userDetails.name , 
                email : userDetails.pass
            }
        };
        console.log(JSON.stringify(x));
        localStorage.setItem('localStor' , JSON.stringify(x));
    }
};

我错过了什么？

Answer 1

如果要禁用提交的默认行为（导致页面刷新），则需要使用<EI_HOME>/conf/Axis2/axis2.xml对象的dependencies { classpath 'com.android.tools.build:gradle:2.3.3' classpath 'com.google.gms:google-services:3.1.0' }方法：

ependencies {
compile fileTree(dir: 'libs', include: ['*.jar'])
androidTestCompile('com.android.support.test.espresso:espresso-core:2.2.2', {
    exclude group: 'com.android.support', module: 'support-annotations'
})



compile 'com.android.support:appcompat-v7:25.3.1'
compile 'com.android.support.constraint:constraint-layout:1.0.2'
compile 'com.google.firebase:firebase-auth:10.0.1'
compile 'com.google.firebase:firebase-database:9.2.0'
compile 'com.github.barteksc:android-pdf-viewer:2.4.0'
compile 'com.google.firebase:firebase-storage:10.0.1'
testCompile 'junit:junit:4.12'
}
apply plugin: 'com.google.gms.google-services'

Answer 2

这是因为事件被触发并且它会对表单进行提交，以防止它出现在第一行：

e.preventDefault（）

Answer 3

您可以阻止表单提交和重新加载导致您丢失控制台信息的页面，或者在Chrome中选择preserve the log，这将保留任何重新加载之间的日志。

要在Chrome中保留控制台，请单击控制台右上角的齿轮图标，然后选择“保留日志”。然后，您可以按原样运行脚本。

为什么控制台.log不工作并刷新页面？

3 个答案: