Question

我有一个表单，用户可以上传他们感兴趣的图像，将其锁定在UI徽标位置。因此，当通过表单上传这些图像时，一旦用户上传并触发后保存按钮，该按钮在表单中显示40 * 40px图像以显示用户先前上载的内容。这个40 * 40px图像在所有浏览器中都清晰可见，但在IE8，IE9，IE11中没有。我在寻找周围并累了之后尝试了很多解决方案。任何人都可以帮助为什么这不会发生在IE中。

提前致谢。

这是

中带有“Img”标签的表单

<form:form id="submitform"  action="updatePolicyLogo.non" name="policyLogosForm" modelAttribute="policyLogos" method="POST" autocomplete="off" enctype="multipart/form-data">
<fieldset>
    <label for="policyId" title='<spring:message code="tt.mysettings.policy" />'><spring:message    code="label.policy" /></label>
    <form:select id="policyId" path="policyId" style="width:160px;">
        <form:options items="${policies}" itemValue="value" itemLabel="label" htmlEscape="false" />
    </form:select>
    <br/>
    <label for="policyLogo"> <spring:message code="label.policy.logo.current" /></label>
    <img id="existingImageId" src="icons/icn_delete.png"/> 
    <a id="deleteImageId"> <img id="deleteImg" src="icons/icn_delete.png"  style="margin-top:6px"/> </a>
    <div id="noneLogo"> <spring:message code="label.policy.logo.none" /> </div>
    <br/>
    <label> <spring:message code="label.policy.logo.new" /></label>  <form:input id="policyLogo" path="policyLogo" style="width:160px;" type="file" accept="image/*" />
    <form:errors path="policyLogo" />                
</fieldset>

<div class="submit">
    <input type="submit" class="button" value='<spring:message code="label.button.save" />' />
</div>

我在这里通过Jquery添加图像。

$("#existingImageId").attr("src", "getLogo.ams?id="+selectedPolicyId).bind('load', function(event) {
        event.preventDefault();
        $("#noneLogo").css('display', 'none');
        $("#existingImageId").css('display', 'block');
        $("#deleteImg").css('display', 'block');
        alert("src");
    });

在Chrome中，我在加载后获得以下HTML

<form id="submitform" name="policyLogosForm" action="updatePolicyLogo.ams" method="POST" enctype="multipart/form-data" autocomplete="off">
<fieldset>
    <label for="policyId" title="Policy must be accessible by creator.">Policy</label>
    <select id="policyId" name="policyId" style="width:160px;">
        <option value="1" selected="selected">All Policies</option>
    </select>
    <br>
    <label for="policyLogo"> Current Logo</label>
    <img id="existingImageId" src="getLogo.ams?id=1" style="display: block;"> 
    <a id="deleteImageId"> <img id="deleteImg" src="icons/icn_delete.png" style="margin-top: 6px; display: block;"> </a>
    <div id="noneLogo" style="display: none;"> No Logo Selected. </div>
    <br>
    <label> New Logo</label>  <input id="policyLogo" name="policyLogo" style="width:160px;" accept="image/*" type="file" value="org.springframework.web.multipart.commons.CommonsMultipartFile@16860f88">

</fieldset>

<div class="submit">
    <input type="submit" class="button" value="Save">
</div>

我还发现了一些无法在此处找到解决方案的相关问题http://madebyted.com/blog/using-images-as-labels-inside-forms-in-internet-explorer-11/和https://github.com/desandro/imagesloaded/issues/40

图像未在IE中加载，但在所有其他浏览器中加载

0 个答案: