如何在完成上传文件后禁用按钮选择文件上传?

时间:2014-11-19 04:20:56

标签: javascript php mysql

如果我们有5个按钮选择文件上传文件并且想要在我们完成上传每个按钮后自动禁用按钮,我们怎么知道" A"按钮选择文件有行" A"在我们的表db mysql中。因此,如果用户在上传3个文件后退出,则再次登录。他只看到2个按钮选择启用的文件?谢谢你的帮助。

这是我的代码:

upload_image.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>';
}
?>

1 个答案:

答案 0 :(得分:0)

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

将您的php代码结束以便上传时,将Cookie值设置为false。

所以这样你就会在JS cookie代码中得到错误,你可以调用你的按钮禁用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
);
}