圖片上傳的jQuery不形

-5

<div id="cb"> 
    <span> 
     <br> 
     "test.jpg" 
    </span> 
    <br> 
    <img src="datat:image/jpeg;base64/9ikdsaasdflaljkf" class ="0"> 
</div>

我想上傳文件按鈕點擊沒有形式提交。我正在關注一個教程，其中說

var file = $("#cb")[0].files[0];

但是這條線我沒有得到任何價值。有誰能夠幫助我。

來源

2016-10-05 S S

var文件= $（「＃CB」）[0] .files [0]。名稱;點擊按鈕點擊 –

是的，那是不可能的？ –

你想得到什麼？ –

試試這個：

$(document).ready(function(){ 
    $('#upload').on('click', function() { 
     var file_data = $('#pic').prop('files')[0]; 
     var form_data = new FormData(); 
     form_data.append('file', file_data); 

     $.ajax({ 
       url   : 'upload.php',  // point to server-side PHP script 
       dataType : 'text',   // what to expect back from the PHP script, if anything 
       cache  : false, 
       contentType : false, 
       processData : false, 
       data  : form_data,       
       type  : 'post', 
       success  : function(output){ 
        alert(output);    // display response from the PHP script, if any 
       } 
     }); 
     $('#pic').val('');      /* Clear the file container */ 
    }); 
}); 
</script> 
</head> 

<body> 
<input id="pic" type="file" name="pic" /> 
<button id="upload">Upload</button> 
</body>

upload.php的

<?php 
    if ($_FILES['file']['error'] > 0){ 
     echo 'Error: ' . $_FILES['file']['error'] . '<br>'; 
    } 
    else { 
     if(move_uploaded_file($_FILES['file']['tmp_name'], 'uploads/' . $_FILES['file']['name'])) 
     { 
      echo "File Uploaded Successfully"; 
     } 
    } 

?>

來源

2016-10-05 09:17:35

是的，我下面這個樣子：但在我來說，我VAR file_data = $（「＃PIC」）丙（「文件」）[0];。我因此未得到任何價值 –

文件控制亙古有文件最初所以也顯示爲空。您可以點擊上傳所以取上傳按鈕單擊事件裏面的文件，你瀏覽過的文件後，後取

$('#btn-upload').click(function(){ 

var file = $("#cb")[0].files[0]; 
alert(file); // Shows [object File] i.e. file object 

var fileName = $("#cb")[0].files[0].name; // Gives filename 

});

來源

2016-10-05 09:18:56

你這樣的代碼

$('#btn-upload').click(function() { 
 
    var file = $("#cb")[0].files[0].name; 
 
    console.log(file); 
 
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<tr> 
 
    <td><div id="cp"></div></td> 
 
    <td> 
 
     <input id="cb" type='file' name="cb" /> 
 
     <button type="submit" name="btn-upload" id="btn-upload">upload</button> 
 
    </td> 
 
</tr>

來源

2016-10-05 09:19:53

感謝這個工作 –

高興，這有助於:-) –

您可以使用Cloudinary的jQuery文件上傳插件，使用此解決方案，您可以直接從瀏覽器上傳圖像。從在HTML頁面GitHub的項目和JS文件夾

下載jquery.cloudinary.js，包括包括jQuery庫後jquery.cloudinary.js。

<script src='jquery.min.js' type='text/javascript'></script> 
<script src='jquery.cloudinary.js' type='text/javascript'></script>

也從GitHub項目的js文件夾下載下列文件。

jquery.ui.widget.js 
jquery.iframe-transport.js 
jquery.fileupload.js

，幷包含所有必需的jQuery文件在HTML頁面中：

<script src='jquery.min.js' type='text/javascript'></script> 
<script src='jquery.ui.widget.js' type='text/javascript'></script> 
<script src='jquery.iframe-transport.js' type='text/javascript'></script> 
<script src='jquery.fileupload.js' type='text/javascript'></script> 
<script src='jquery.cloudinary.js' type='text/javascript'></script>

你可以在這裏找到更多的信息。 http://cloudinary.com/documentation/jquery_integration

來源

2017-06-13 06:05:49

圖片上傳的jQuery不形

回答

相關問題