javascript - 使用 jquery 获取 html 属性值

Question

我正在将文件直接上传到 amazon S3。第二个输入标签在页面加载时已经存在，但只有在文件上传到 S3 存储桶时才会插入具有值的第一个输入标签。

我想使用 jquery 从第一个输入标签中获取 id 和 filename 值，以便能够将它们插入到 URL 路径中。我怎样才能获得这些值？

<span class="btn btn-success btn-sm btn-file">Choose image
  <input value={'id': '55e3385361c84c81c98087907e3f424ff4db6dac412cdcadf40090c04c25',
                'filename': 'firstlogo.png', 
                'content_type':'image/png',
                'size':43393}" 
         data-reference="d105c8c6fd72880c844dc61cb52b0639" 
         type="hidden" 
         name="product[product_image]">
  <input presigned="true" 
         direct="true" 
         class="choose-product-file" 
         data-direct="true" 
         data-as="file" 
         data-url="/attachments/cache/presign" 
         data-presigned="true" 
         data-reference="d105c8c6fd72880c844dc61cb52b0639" 
         accept=".png,.jpg,.jpeg" 
         type="file" 
         id="product_product_image">
</span>

Answer 1

解决方案:

获取input的值，转成JSON，获取数据

let value = $('.btn input:first-child').val();
let data = JSON.parse(value.replace(/'/g, '"'));

// values needed
let id = data.id;
let filename = data.filename;