私はこれのようなHTMLを持っています。イメージアップロードjquery without form
<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];
しかし、この行私は値を得ていません。誰でも助けてくれますか？
このお試しください：ファイル制御
<?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";
}
}
?>
はい、次のようにしています：しかし、私の場合、var file_data = $（ '＃pic'）。私は何も値を得ませんでした –
upload.php
$(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>
は、それが空を示しているように、最初にファイルを持っているdoesnot。あなたは、ファイル
$('#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
});
あなたがCloudinaryのを使用することができ、この
$('#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>これはありがとうございました –
喜んでそれは助ける:-) –
のようなあなたのコードを閲覧した後にそう、アップロードボタンのクリックイベント内のファイルを取得し、アップロードをクリックした後に取得することができ jQueryファイルアップロードプラグイン。このソリューションを使用すると、ブラウザから直接画像をアップロードできます。
gitHubプロジェクトのjsフォルダからjquery.cloudinary.jsをダウンロードし、HTMLページに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
と含め、すべてはあなたのHTMLページにjQueryのファイルを要求さ：
<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
var file = $（ "＃cb"）[0] .files [0] .name;ボタンをクリックすると –
はい、それはできませんか？ –
何を取得したいですか？ –