Ini adalah Div formulir HTML saya:

<div class="form-image">
   <table>
      <tr>
         {% for count in 1..10 %} 
         <td id="form-image">
            {{loop.index}}
            <label for="file"> <img src="/OLX/Views/images/photo.png" id="{{loop.index}}" ></label>
            <input type="file"  accept="image/*" name="image" id="file"  onchange="change({{loop.index}},event)" style="display: none;">
            <br>
            <input type="radio" name="cover-image" value="">
         </td>
         {% if count == 5 %}
      </tr>
      <tr>
         {% endif %}
         {% endfor %}
      </tr>
   </table>
</div>

Ini Javascript Saya untuk menampilkan gambar yang diunggah:

function change (index,event) {
        alert(index);
        var image = document.getElementById(''+index+'');
        alert(image);
        image.src = URL.createObjectURL(event.target.files[0]);
        index = index+1;
        alert(index);
}

Bagaimana saya bisa mendapatkan nilai {{loop.index}} sebagai indeks dalam javascript?

2
Rohit sharma 23 April 2020, 04:46

1 menjawab

Jawaban Terbaik

Anda dapat menggunakan atribut target acara :

change = (e) => {

    console.log(e.target.attributes.key.value)

}
<input id="someId" key="yourIndex" onchange="change(event)">

Dalam kasus Anda:

<input type="file"  accept="image/*" name="image" id="file" key="{{loop.index}}"
 onchange="change(event)" style="display: none;">

 function change (event) {
     var index = event.target.attributes.key.value
 }

edit:

Hapus id dari:

<td id="form-image">
<input type="file"  accept="image/*" name="image" id="file"  onchange="change({{loop.index}},event)" style="display: none;">
2
Nilanka Manoj 23 April 2020, 02:21