Ich habe eine Anforderung, wo ich die ID des Labels erhalten muss, das dem Feld für den Eingabedateityp zugeordnet ist. Ich habe eine Reihe von 4 Eingabefelder mit ID's Foto1, Foto2, Foto3, Foto4. Die Etiketten, die diesen Dateifeldern zugeordnet sind, sind Label-1, Label-2, Label-3 bzw. Label-4. Meine Anforderung ist, dass ich die entsprechenden Etikettenfelder erhalten und den Text des Etiketts aktualisieren möchte. Das habe ich bisher versucht.Erhalte die ID des Labels, das mit dem Eingabefeld für den Datei-Typ verknüpft ist
<div class="koh-contact-photo">
<span><fmt:message key='photo1' /></span> <label id="upload-1" class="button-default" ><fmt:message
key='photo.upload' /></label>
<div id="preview-1" class="preview"></div>
<button type="button" class="koh-photo-remove remove-button">
<span class="icon" data-icon=""></span> <span
class="label"><fmt:message key='photo.remove.text' /></span>
</button>
<!-- The Modal -->
<div id="myModal1" class="modal">
<!-- Modal content -->
<div class="modal-content">
<span class="close">×</span>
<h3 class="modal-title"> Upload Photo </h3>
<div class="modal-inner">
<span>Browse for a photo</span> <label id="label-1" style="margin-bottom:20px;" class="button-default browse" for="photo1">BROWSE</label><input id="photo1" type="file"
name="photo1" data-parsley-filesize="3"
data-parsley-filetype="image/jpeg, image/png, image/gif, image/bmp"
data-parsley-trigger="change" />
<hr class="modal-hr" />
<div class="guidelines-modal">
<p> GENERAL GUIDELINES </p>
<p> Supported files are: .jpg, .gif, .png, .bmp </p>
<p> Maximum File Size: 3MB</p>
<p style="margin-bottom:10px;"> For best results: upload at 400 x 300</p>
<p> Note: images are automatically resized</p>
</div>
<div class="koh-contact-captcha modal-hr">
<!--div class="g-recaptcha" data-sitekey=<fmt:message key='kohlerSterling.google.captcha.key' />></div-->
<!--div class="g-recaptcha" id="recaptcha1"></div-->
<div id="recaptcha3" class="captcha"></div>
<div class="error-message">
<span><fmt:message key='required.field.text' /></span>
</div>
</div>
<div class="terms-modal">
<div class="checkbox">
<input type="checkbox" id="terms-condns" required/>
<label style="font-family:Helvetica Neue LT Pro Roman !important;font-size:12px !important;color:#000 !important;font-weight:400 !important;" for="terms-condns">I agree to the <a class="modal-anchor" href="#">Terms and Conditions</a></label>
</div>
</div>
<hr class="modal-hr" />
<div class="modal-buttons">
<label class="button-default-modal" style="margin-right:20px;">CANCEL</label>
<label id="input-button-modal-1" class="input-button-modal">UPLOAD</label>
</div>
</div>
</div>
<input type="hidden" id="captchaKey" value="<fmt:message key='google.recaptcha.site.key'/>">
</div>
</div>
Ich habe 4 solche Div-Klassen. und das ist das Javascript.
$contactPhotos.each(function() {
var $photoInput = $(this).find("input[type=file]");
var img = $("<img />");
var photoPreview = $photoInput.parent().parent().parent().parent().find(".preview").attr("id");
var photoPreviewImg = $("#" + photoPreview);
function readURL(input) {
if (input.files && input.files[0]) {
photoPreviewImg.html("");
//alert(JSON.stringify(photoPreviewImg, null, 4));
var reader = new FileReader();
reader.onload = function (e) {
img.attr("style", "height:41px;");
img.attr("style", "width:210px;");
img.attr("src", e.target.result);
}
reader.readAsDataURL(input.files[0]);
}
}
$(this).on('click','.input-button-modal', function(e) {
var contactModal = $(this).parent().parent().parent().parent().parent().find(".modal").attr('id');
var currentModal = $('#' + contactModal);
currentModal.attr("style", "display:none");
photoPreviewImg.append(img);
});
$photoInput.parsley().on('field:success', function() {
var inputID = $photoInput.attr('id');
var inputTarget = '#' + inputID;
var inputValue = document.getElementById(inputID);
//inputLabel.attr("style", 'width:70%;');
readURL(inputValue);
$(inputTarget).parent().parent().parent().parent().find('.koh-photo-remove').show();
$contactForm.find('#terms').prop('required',true);
});
});
Jede Hilfe wird geschätzt. Ich möchte die ID des Labels erhalten, das mit jedem Eingabefeld des Datei-Typs assoziiert ist. Danke im Voraus.
Das hat funktioniert! Vielen Dank Neville! –
Warum bekomme ich ein [Objektobjekt], wenn ich folgendes verlange? var inputLabelId = $ ("label ['für =" + $ photoInput.attr (' id ') +' '] "). attr (" id "); \t \t \t \t \t \t var inputLabel = $ ("#" + inputLabelId); –
Ich habe es Neville herausgefunden. Es war mein schlechtes! Keine Bange –