Question

我在html页面的顶部有一个表单，我希望在提交表单后消失。我的代码（下面），虽然它暂时隐藏了表单，但坚持形成然后再次变得可见。任何帮助将不胜感激。

谢谢，

Owen Walker

<!DOCTYPE html>
<html>
<body>

<form id="form" onsubmit="myFunction()">
  Enter name: <input type="text" name="fname">
  <input type="submit" value="Submit">
</form>

<div id="first_div" style="visibility:hidden">Second</div>

<script>
function myFunction() {
    alert("The form was submitted");
    document.getElementById("form" ).style.display = "none";  
    document.getElementById("first_div" ).style.visibility = "visible";
alert("after"); 
}
</script>

</body>
</html>

Answer 1

您没有做任何事情来阻止您的表单被提交并重新加载页面。将表单行更改为：

<form id="form" onsubmit="return myFunction()">

并在您的功能中添加警告后

return false;

Answer 2

我建议你使用JQuery，因为它是一个强大的工具，可以毫不费力地做这类东西...... 那么你可以用这种方式做到这一点

final DatabaseReference mRef = FirebaseDatabase.getInstance().getReference().child("users");
    FirebaseUser user = FirebaseAuth.getInstance().getCurrentUser();
    if (user != null) {
        final String currentUserUid = user.getUid();

        mRef.addListenerForSingleValueEvent(new ValueEventListener() {
            @Override
            public void onDataChange(DataSnapshot dataSnapshot) {
                if (dataSnapshot.hasChild(uid)) {
                DatabaseReference newRef = mRef.child(uid);
                newRef.addListenerForSingleValueEvent(new ValueEventListener() {
                    @Override
                    public void onDataChange(DataSnapshot dataSnapshot) {
                        if (!dataSnapshot.hasChild(uid)) {
                            DatabaseReference database = FirebaseDatabase.getInstance().getReference();
                            String username = String.valueOf(dataSnapshot.child("username").getValue());
                            String email = String.valueOf(dataSnapshot.child("email").getValue());
                            String firebaseToken = String.valueOf(dataSnapshot.child("firebaseToken").getValue());

                            Friend friend = new Friend(uid, username, email, firebaseToken);
                            database.child(Constants.ARG_USERS)
                                    .child(currentUserUid)
                                    .child(Constants.ARG_FRIENDS)
                                    .child(uid)
                                    .setValue(friend)
                                    .addOnCompleteListener(new OnCompleteListener<Void>() {
                                        @Override
                                        public void onComplete(@NonNull Task<Void> task) {
                                            if (task.isSuccessful()) {
                                                mOnFriendDatabaseListener.onSuccess(context.getString(R.string.friend_successfully_added));
                                            } else {
                                                mOnFriendDatabaseListener.onFailure(context.getString(R.string.friend_unable_to_add));
                                            }
                                        }
                                    });
                        } else {
                            Log.d("Adding Friend", "User already not exist");
                        }
                    }

                    @Override
                    public void onCancelled(DatabaseError databaseError) {

                    }
                });
                } else {
                    Log.d("Adding Friend", "User does not exist");
                }
            }

            @Override
            public void onCancelled(DatabaseError databaseError) {

            }
        });
    }

` 请注意使用preventDefault（）来阻止它在您单击“提交”时提交表单。

如何在javascript中使表单在提交时消失

2 个答案: