2017-04-25 59 views
1

這是我的HTML代碼HTML代碼添加到DIV:如何使用jQuery

<div class="admin__field-control control"> 
      <input id="page_image" name="image" data-ui-id="adminhtml-grid-edit-tab-templatesetup-0-fieldset-element-file-image" value="0" title="Background Image" tabindex="1" onchange="imagechange()" class="input-file" style="" type="file"></div> 

我想要做這樣的使用jquery:

<div class="admin__field-control control"> 
<img id="page_image_image" class="small-image-preview v-middle" src="pokeball.png" title="pokeball.png" alt="pokeball.png" data-ui-id="adminhtml-grid-edit-tab-templatesetup-0-fieldset-element-file-image" width="22" height="22"> 
    <input id="page_image" name="image" data-ui-id="adminhtml-grid-edit-tab-templatesetup-0-fieldset-element-file-image" value="0" title="Background Image" tabindex="1" class="input-file" style="" onchange="imagechange()" type="file"> 
</div> 

它是如何可能使用jQuery ...請幫我...

+0

如果你想添加一些你想看看現有元素在append方法 - http://api.jquery.com/append/ –

回答

0

使用append

var apnd = '<img id="page_image_image" class="small-image-preview v-middle" src="pokeball.png" title="pokeball.png" alt="pokeball.png" data-ui- id="adminhtml-grid-edit-tab-templatesetup-0-fieldset-element-file-image" width="22" height="22">'; 
    $('.admin__field-control').append(apnd); 
0

請參閱下面的代碼片段。 新圖像源將是一個可供選擇圖像選項中選擇

function imagechange(){ 
 
    var image = document.createElement('img'); 
 
    image.src = $(".input-file").val(); 
 
    $(image).appendTo(".admin__field-control"); 
 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="admin__field-control control"> 
 
      <input id="page_image" name="image" data-ui-id="adminhtml-grid-edit-tab-templatesetup-0-fieldset-element-file-image" value="0" title="Background Image" tabindex="1" onchange="imagechange()" class="input-file" style="" type="file"></div>

0

使用jQuery prepend()

$(document).ready(function() { 
    var html = '<img id="page_image_image" class="small-image-preview v-middle" src="pokeball.png" title="pokeball.png" alt="pokeball.png" data-ui-id="adminhtml-grid-edit-tab-templatesetup-0-fieldset-element-file-image" width="22" height="22">'; 
    $(".admin__field-control").prepend(html); 

});