猿问

如何从 HTML 表单和 PHP 脚本创建单个文件，以便从弹出模式访问它？

用户通过 html 将文件及其详细信息上传到服务器。然后，该描述将被插入到 MySQL 数据库中。


目前，该过程是通过 html 表单 + php 脚本处理的。


如何将这些组合成一个脚本，其中描述是通过模态表单输入的，并通过按钮激活。


索引.html


<head>

  <meta charset="UTF-8">

  <title>Upload file and add to database</title>

</head>


<body>

  <form action="comb-insert.php" method="post" enctype="multipart/form-data">

    <p>

      <label for="file">Choose file:</label>

      <input type="file" name="file" id="file">

    </p>


    <p>

      <label for="category">category:</label>

      <input type="text" name="category" id="category">

    </p>


    <p>

      <label for="title">title:</label>

      <input type="text" name="title" id="title">

    </p>


    <p>

      <label for="embedcode">embedcode:</label>

      <input type="text" name="embedcode" id="embedcode">

    </p>


    <p>

      <label for="video_platform">video_platform:</label>

      <input type="text" name="video_platform" id="video_platform">

    </p>



    <input type="submit" value="Submit">

  </form>

</body>


</html>


收到一只叮咚
浏览 79回答 1
1回答

牛魔王的故事

如果我理解你的问题，这应该可以解决问题，如果没有，请说明我错了什么，以便我可以编辑我的答案// Get the modalvar modal = document.getElementById("myModal");// Get the button that opens the modalvar btn = document.getElementById("myBtn");// Get the <span> element that closes the modalvar span = document.getElementsByClassName("close")[0];// When the user clicks the button, open the modal btn.onclick = function() {  modal.style.display = "block";}// When the user clicks on <span> (x), close the modalspan.onclick = function() {  modal.style.display = "none";}// When the user clicks anywhere outside of the modal, close itwindow.onclick = function(event) {  if (event.target == modal) {    modal.style.display = "none";  }}/* The Modal (background) */.modal {  display: none;  /* Hidden by default */  position: fixed;  /* Stay in place */  z-index: 1;  /* Sit on top */  padding-top: 100px;  /* Location of the box */  left: 0;  top: 0;  width: 100%;  /* Full width */  height: 100%;  /* Full height */  overflow: auto;  /* Enable scroll if needed */  background-color: rgb(0, 0, 0);  /* Fallback color */  background-color: rgba(0, 0, 0, 0.4);  /* Black w/ opacity */}/* Modal Content */.modal-content {  background-color: #fefefe;  margin: auto;  padding: 20px;  border: 1px solid #888;  width: 80%;}/* The Close Button */.close {  color: #aaaaaa;  float: right;  font-size: 28px;  font-weight: bold;}.close:hover,.close:focus {  color: #000;  text-decoration: none;  cursor: pointer;}<h2>Modal Example</h2><!-- Trigger/Open The Modal --><button id="myBtn">Open Modal</button><!-- The Modal --><div id="myModal" class="modal">  <!-- Modal content -->  <div class="modal-content">    <span class="close">&times;</span>    <form action="comb-insert.php" method="post" enctype="multipart/form-data">      <p>        <label for="file">Choose file:</label>        <input type="file" name="file" id="file">      </p>      <p>        <label for="category">category:</label>        <input type="text" name="category" id="category">      </p>      <p>        <label for="title">title:</label>        <input type="text" name="title" id="title">      </p>      <p>        <label for="embedcode">embedcode:</label>        <input type="text" name="embedcode" id="embedcode">      </p>      <p>        <label for="video_platform">video_platform:</label>        <input type="text" name="video_platform" id="video_platform">      </p>      <input type="submit" value="Submit">    </form>  </div></div>我建议使用 AJAX 来处理请求，因为您可以更好地控制提交后发生的情况，而不是将客户端发送到表单操作点
0
随时随地看视频慕课网APP

相关分类

Html5
我要回答