如何使用jquery在数据库中添加图像扩展?

时间:2017-10-01 00:14:33

标签: javascript php jquery html

我正在尝试使用jquery将照片添加到数据库,但照片不会上传到服务器,并且在数据库中没有显示文件扩展名。当我上传没有jquery时没有问题。

每次尝试使用insert-photo.php时,文件都不会存储。

<?php // autoload_real.php @generated by Composer class ComposerAutoloaderInit01a3dc0b1f885ed2b645be37711584c1 { private static $loader; public static function loadClassLoader($class) { if ('Composer\Autoload\ClassLoader' === $class) { require __DIR__ . '/ClassLoader.php'; } } public static function getLoader() { if (null !== self::$loader) { return self::$loader; } spl_autoload_register(array('ComposerAutoloaderInit01a3dc0b1f885ed2b645be37711584c1', 'loadClassLoader'), true, true); self::$loader = $loader = new \Composer\Autoload\ClassLoader(); spl_autoload_unregister(array('ComposerAutoloaderInit01a3dc0b1f885ed2b645be37711584c1', 'loadClassLoader')); $useStaticLoader = PHP_VERSION_ID >= 50600 && !defined('HHVM_VERSION') && (!function_exists('zend_loader_file_encoded') || !zend_loader_file_encoded()); if ($useStaticLoader) { require_once __DIR__ . '/autoload_static.php'; call_user_func(\Composer\Autoload\ComposerStaticInit01a3dc0b1f885ed2b645be37711584c1::getInitializer($loader)); } else { $map = require __DIR__ . '/autoload_namespaces.php'; foreach ($map as $namespace => $path) { $loader->set($namespace, $path); } $map = require __DIR__ . '/autoload_psr4.php'; foreach ($map as $namespace => $path) { $loader->setPsr4($namespace, $path); } $classMap = require __DIR__ . '/autoload_classmap.php'; if ($classMap) { $loader->addClassMap($classMap); } } $loader->register(true); if ($useStaticLoader) { $includeFiles = Composer\Autoload\ComposerStaticInit01a3dc0b1f885ed2b645be37711584c1::$files; } else { $includeFiles = require __DIR__ . '/autoload_files.php'; } foreach ($includeFiles as $fileIdentifier => $file) { composerRequire01a3dc0b1f885ed2b645be37711584c1($fileIdentifier, $file); } return $loader; } } function composerRequire01a3dc0b1f885ed2b645be37711584c1($fileIdentifier, $file) { if (empty($GLOBALS['__composer_autoload_files'][$fileIdentifier])) { require $file; $GLOBALS['__composer_autoload_files'][$fileIdentifier] = true; } } 上传图片没有任何问题

html代码:

insert-photo.js

insert-photo.php代码:

<form method='post' id="myForm" action='insert-photo.php' enctype='multipart/form-data'>

Upload pic: <input type='file' name='pic'><br />
album:  <select name='subid'>

                <?php
                $lp = mysql_query("select * from gallery where subid=0") or die("error");
                while ($lpr = mysql_fetch_assoc($lp)){
                  echo "<option value='".$lpr['pid']."'>".$lpr['title']."</option>";
                }
                ?>
       </select><br>

  <br>
<button id="sub" >add</button><br><br>
<div id="live_data"></div>
</form>

<span id="result"></span>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script src="insert-photo.js"></script>

insert-photo.js代码:

<?php
        include_once('../connect.php');
        $title= $_POST['title'];
$name = $_FILES['pic']['name'];
$size = $_FILES['pic']['size'];
                $subid= $_POST['subid'];

     $extension = pathinfo($name,PATHINFO_EXTENSION);
    $array = array('png','gif','jpeg','jpg','JPG');
       if (!in_array($extension,$array)){
            echo "<div class='faild'>".$array[0]."-".$array[1]."-".$array[2]."-".$array[3]." --> (".$name.")</div>";
       }else if ($size>100000000){
            echo "<div class='faild'>Size</div>";
       }else {
            $new_image = time().'.'.$extension;
            $file = "images/slids";
            $pic = "$file/".$new_image;
            move_uploaded_file($_FILES["pic"]["tmp_name"],"../".$pic."");
         $insert = mysql_query("INSERT INTO `gallery` (`pid`, `title`, `pic`, `subid`) VALUES (NULL, '$title', '$pic','$subid')") or die("error");
     if (isset($insert)){
         echo "Successfully Inserted";
        }else{
        echo "Insertion Failed";
        }
      }

?>

2 个答案:

答案 0 :(得分:0)

仅通过序列化表单无法做到这一点。您可以使用现成的库或尝试将FormData类用于当前浏览器 构建数据使用:

var data = new FormData(jQuery(&#39; form&#39;)[0]);

查看这篇文章,它说的更多然后我可以说: http://blog.teamtreehouse.com/uploading-files-ajax 我强烈建议您使用现有的库。

答案 1 :(得分:0)

只需更改以下代码即可。

老年人:

<button id="sub" >add</button

新人:

<button type="submit" id="sub" >add</button>

它会起作用。