为了账号安全,请及时绑定邮箱和手机立即绑定

为什么将我的 div 类更改为表单会改变我网站的功能

为什么将我的 div 类更改为表单会改变我网站的功能

慕勒3428872 2023-09-18 10:10:36
我正在为我的网站上传文件,当我尝试将 id 为“cool-border”的 div 更改为表单元素以便能够上传文件时,我的代码不再有效。当我选择一个文件时,文件名不再显示在文件文本范围中。我删除了一些用于拖放过程的代码以整理混乱,但是是的,我很困惑抱歉,缩放比例不稳定,哈哈,我还没有让它响应body {    margin: 0;    padding: 0;    box-sizing: border-box;    font-family: Arial, Helvetica, sans-serif;    background-color: black;}#dropContainer {    border-radius: 1em;    color: #effffb;    background-color: #6cd89d;        font-size: large;    font-weight: bold;    margin: 20px;    padding: 1em;    text-align: center;    line-height: 2em;    max-width: 50vh;}#fakeButton {    background-color: #a5a5a5;    border: none;    border-radius: 5px;    padding: 5px;    cursor: pointer;    color: #effffb;}#fakeButton:hover{    background-color: #5c5c5c;}span {    font-size: small;    font-weight: normal;}#cool-border {    background-image: linear-gradient(90deg, #effffb 50%, transparent 50%), linear-gradient(90deg, #effffb 50%, transparent 50%), linear-gradient(0deg, #effffb 50%, transparent 50%), linear-gradient(0deg, #effffb 50%, transparent 50%);    background-repeat: repeat-x, repeat-x, repeat-y, repeat-y;    background-size: 15px 2px, 15px 2px, 2px 15px, 2px 15px;    background-position: left top, right bottom, left bottom, right   top;    animation: border-dance 1s infinite linear;    border-radius: 5px;    padding: 1em;}@keyframes border-dance {    0% {      background-position: left top, right bottom, left bottom, right   top;    }    100% {      background-position: left 15px top, right 15px bottom , left bottom 15px , right   top 15px;    }  }}<!DOCTYPE html><html><head>    <link href="style.css" rel="stylesheet">    <meta charset="UTF-8">    <meta name="viewport" content="width=device-width, initial-scale=1.0">    <title>File Upload</title></head><body>
查看完整描述

1 回答

?
杨__羊羊

TA贡献1943条经验 获得超7个赞

您的按钮需要具有 type="button" 属性,如下所示:

<button type="button" id="fakeButton">Select a file</button>

否则,它充当提交按钮,如果没有指定操作,它基本上会刷新浏览器。

type: 按钮的默认行为。可能的值有: 该按钮将表单数据提交到服务器。如果未为与表单关联的按钮指定该属性,或者该属性为空值或无效值,则这是默认值。

查看完整回答
反对 回复 2023-09-18
  • 1 回答
  • 0 关注
  • 58 浏览

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信