0
我想讓用戶上傳他們正在捐贈的項目的圖片。出於某種原因，他們正在上傳的文件的名稱在他們選擇之後不會顯示。我查看了以前詢問的question，而且我的代碼仍然有問題。我只是不確定它爲什麼不顯示文件名。引導文件上傳不顯示文件名
這裏是我的代碼：
$(document).ready(function() {
$('#new-btn').on('click', function() {
$('#new-div').append($('.fileinputs').html());
});
$(document).on('fileselect', '.btn-file :file', function(event, numFiles, label) {
var input = $(this).closest('.input-group').find(':text'),
log = numFiles > 1 ? numFiles + ' files selected' : label;
if (input.length) {
input.val(log);
} else {
if (log) alert(log);
}
});
});
$(document).on('change', '.btn-file :file', function() {
var input = $(this),
numFiles = input.get(0).files ? input.get(0).files.length : 1,
label = input.val().replace(/\\/g, '/').replace(/.*\//, '');
input.trigger('fileselect', [numFiles, label]);
console.log('triggered');
});.container {
padding-bottom: 30px;
}
.btn-file {
position: relative;
overflow: hidden;
}
.btn-file input[type=file] {
position: absolute;
top: 0;
right: 0;
min-width: 100%;
min-height: 100%;
font-size: 100px;
text-align: right;
filter: alpha(opacity=0);
opacity: 0;
background: red;
cursor: inherit;
display: block;
}
input[readonly] {
background-color: white !important;
cursor: text !important;
}<script src="https://netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<link href="https://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.4.11/d3.min.js"></script>
<div class="container">
<div class="row">
<div class="col col-xs-12 col-md-6 col-md-offset-3">
<div class="panel panel-default">
<div class="panel-heading text-center">
<h4>New Donation</h4>
</div>
<form class="form ws-validate" method="post" action="add.php" enctype="multipart/form-data">
<div class="panel-body">
<input type="hidden" name="add" value="1" />
<div class="form-group col col-md-6">
<label for="GroupID">Organization</label>
<select class="form-control" name="GroupID" readonly value="<?php echo $row['id']; ?>">
<option value="<?php echo $row['id']; ?>" readonly selected>
<?php echo $row[ "Name"]; ?>
</option>
</select>
</div>
<div class="form-group col col-md-6">
<label for="DonationType">Donation Type</label>
<select class="form-control" name="DonationType" value="<?php echo $_POST['donationType']; ?>" readonly>
<option readonly selected value="<?php echo $_POST['donationType']; ?>">
<?php echo $_POST[ 'donationType']; ?>
</option>
</select>
</div>
<div class="form-group required col col-md-6">
<label for="ItemName">Item Name</label>
<input type="text" class="form-control" name="ItemName" id="ItemName" required />
</div>
<div class="form-group required col col-md-6">
<label for="Date">Date Donated</label>
<input type="text" class="form-control datepicker" name="Date" id="Date" required autocomplete="off" />
</div>
<div class="form-group required col col-md-4">
<label for="ItemValue">Value per Item</label><span class="text-muted pull-right" style="cursor:pointer;" data-toggle="modal" data-target="#itemInfo"><span class="fa fa-info-circle"></span></span>
<div class="input-group">
<span class="input-group-addon">$</span>
<input type="number" class="form-control sums num1" name="ItemValue" id="ItemValue" step="0.01" min="0" placeholder="0.00" />
</div>
</div>
<div class="form-group col col-md-4">
<label for="ItemQuantity">Quantity</label>
<input type="number" class="form-control sums num2" name="ItemQuantity" id="ItemQuantity" min="0" value="1" />
</div>
<div class="form-group col col-md-4">
<label for="Total">Total</label>
<div class="input-group">
<span class="input-group-addon">$</span>
<input type="text" class="form-control" name="Total" id="Total" step="0.01" readonly placeholder="-" />
</div>
</div>
<div class="form-group col col-md-8">
<label for="ItemDescription">Description</label>
<textarea class="form-control" name="ItemDescription" id="ItemDescription" style="height: 34px; max-height: 100px; resize: vertical;" required></textarea>
</div>
<div class="form-group col col-md-4">
<label for="ItemQuality">Item Quality</label>
<select class="form-control" name="ItemQuality" id="ItemQuality">
<option value="" selected disabled>-</option>
<option value="High">High</option>
<option value="Medium">Medium</option>
<option value="Low">Low</option>
</select>
</div>
<div class="form-group col col-xs-12">
<label for="file">Image Upload</label>
<div class="input-group">
<span class="input-group-btn">
\t \t \t \t \t \t \t \t \t <span class="btn btn-primary btn-file">
\t \t \t \t \t \t \t \t \t \t Browse… <input type="file" name="uploadedfile" id="uploadedfile" >
\t \t \t \t \t \t \t \t \t </span>
</span>
<input type="text" class="form-control" readonly>
</div>
<span class="help-block">
\t \t \t \t \t \t \t </span>
</div>
</div>
<div class="panel-footer">
<span onclick="history.go(-1);" class="btn btn-default">Back</span>
<button type="submit" class="btn btn-primary pull-right">Submit</button>
</div>
</form>
</div>
</div>
</div>
</div>關於這個問題的任何幫助將不勝感激。