javascript - 上传文件完成后如何禁用php中选择文件上传的按钮？

Question

如果我们有 5 个按钮选择文件来上传文件，并且希望在完成每个按钮的上传后自动禁用按钮，我们如何知道“A”按钮选择文件在我们的表数据库中有行“A” mysql。因此，如果用户在上传 3 个文件后注销，则需要重新登录。他只看到两个按钮选择启用的文件？感谢您的帮助。

这是我的代码:

上传图片.php

<table align="center" width="800" height="500" class="tengah">
<tr>
<td align="center"><img src="img/logoo.fw.png"></td>
<td>&nbsp;&nbsp;&nbsp;&nbsp;</td>
<form action="multiple_upload_image.php" method="post" enctype="multipart/form-data" name="form1"     id="form1">
<td align="center"><img src="img/upload.fw.png"><br><br>
1. Select Image : &nbsp;<input name="ufile[]" type="file" id="ufile[]" size="50" /><br><br>
2. Select Image : &nbsp;<input name="ufile[]" type="file" id="ufile[]" size="50" /><br><br>
3. Select Image : &nbsp;<input name="ufile[]" type="file" id="ufile[]" size="50" /><br><br>
4. Select Image : &nbsp;<input name="ufile[]" type="file" id="ufile[]" size="50" /><br><br>
5. Select Image : &nbsp;<input name="ufile[]" type="file" id="ufile[]" size="50" /><br><br>
<input type="submit" name="Submit" value="Upload" align="right"/> </form>
<a href="home.php"><input type="submit" name="Submit" value="Finished"  align="right"/></a><br><br>
*) Total Max Upload only 10MB
</td>
</tr>

</table>

这里是我的 php 代码:

<?php
error_reporting(E_ALL^(E_NOTICE | E_WARNING));
set_time_limit(0);
session_start();
$username=$_SESSION['userr'];
$password=$_SESSION['passw'];
$user_id=$_SESSION['usr_id'];
mysql_connect("localhost","root","");
mysql_select_db("person");
if(isset($_FILES['ufile'])){
$errors= array();
foreach($_FILES['ufile']['tmp_name'] as $key => $tmp_name ){
    $file_name = $key.$_FILES['ufile']['name'][$key];
    $file_size =$_FILES['ufile']['size'][$key];
    $file_tmp =$_FILES['ufile']['tmp_name'][$key];
    $file_type=$_FILES['ufile']['type'][$key];  
    if($file_size > 30000000){
    $errors[]='File size must be less than 10 MB';
    }   
mysql_connect("localhost","root","");
mysql_select_db("person");  
$query = "INSERT INTO image (user_id, name, type, size ) ".
"VALUES ('$user_id','$file_name','$file_type','$file_size')"; 
mysql_query($query) or die('Error, query failed');
move_uploaded_file($file_tmp,"image_file/".$file_name);
}
mysql_query($query);        

    }else{
            print_r($errors);
    }

if(empty($error)){
    echo '<script type=text/javascript>
alert("Registration was succeed");
window.location.href = "home.php";
</script>';
}
?>

Answer 1

您需要在上传开始时将一个 cookie 值设置为 true，并定期使用 jquery cookie 检查相同的 cookie 值。

在 php 代码上传结束处将 cookie 值设置为 false。

这样你的 JS cookie 代码就会得到 false，你可以调用你的按钮禁用 js 代码。

客户端源代码 - Javscript

function getCookie( name ) {
   var parts = document.cookie.split(name + "=");
   if (parts.length == 2) return parts.pop().split(";").shift();
}

function expireCookie( cName ) {
    document.cookie =  encodeURIComponent( cName ) + "=deleted; expires=" + new Date( 0 ).toUTCString();
}

function setCursor( docStyle, buttonStyle ) {
    document.getElementById( "doc" ).style.cursor = docStyle;
    document.getElementById( "button-id" ).style.cursor = buttonStyle;
}

function setFormToken() {
    var downloadToken = new Date().getTime();
    document.getElementById( "downloadToken" ).value = downloadToken;
    return downloadToken;
}

var downloadTimer;
var attempts = 30;

// Prevents double-submits by waiting for a cookie from the server.
function blockResubmit() {
var downloadToken = setFormToken();
setCursor( "wait", "wait" );

downloadTimer = window.setInterval( function() {
  var token = getCookie( "downloadToken" );

  if( (token == downloadToken) || (attempts == 0) ) {
    unblockSubmit();
  }

      attempts--;
    }, 1000 );
  }

function unblockSubmit() {
    setCursor( "auto", "pointer" );
    window.clearInterval( downloadTimer );
    expireCookie( "downloadToken" );
}

服务器代码 - PHP

$TOKEN = "downloadToken";

// Sets a cookie so that when the download begins the browser can
// unblock the submit button (thus helping to prevent multiple clicks).
// The false parameter allows the cookie to be exposed to JavaScript.
$this->setCookieToken( $TOKEN, $_GET[ $TOKEN ], false );

$result = $this->sendFile();

地点:

public function setCookieToken(
$cookieName, $cookieValue, $httpOnly = true, $secure = false ) {

// See: http://stackoverflow.com/a/1459794/59087
// See: http://shiflett.org/blog/2006/mar/server-name-versus-http-host
// See: http://stackoverflow.com/a/3290474/59087
setcookie(
  $cookieName,
  $cookieValue,
  2147483647,            // expires January 1, 2038
  "/",                   // your path
  $_SERVER["HTTP_HOST"], // your domain
  $secure,               // Use true over HTTPS
  $httpOnly              // Set true for $AUTH_COOKIE_NAME
);
}