用jquery获取html属性值

时间:2016-02-18 21:54:31

标签: javascript jquery html file-upload amazon-s3

我正在将文件直接上传到amazon S3。第二个输入标记已经存在于页面加载中,但是当文件上传到S3存储桶时,只会插入带有值的第一个输入标记。

我想从第一个带有jquery的输入标记中获取idfilename值,以便能够将它们插入到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>

4 个答案:

答案 0 :(得分:1)

如果您在第一个输入标记的值中存储了idfilename,请首先获取该值的JSON.stringify版本,然后将其解析为json然后从第一个输入标记的值的id中单独提取filenameparsed JSON

检查下面的工作代码段。

代码段

&#13;
&#13;
$(document).ready(function() {
  this_var = $('input#first').val();
  json = JSON.stringify(eval("(" + this_var + ")"));
  json = JSON.parse(json);
  var temp = $('#print').text();
  temp += "id:" + json["id"] + "<br>";
  temp += "filename:" + json["filename"] + "<br>";
  $('#print').html(temp);
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<span class="btn btn-success btn-sm btn-file">Choose image
  <input id="first" 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>
<div id="print"></div>
&#13;
&#13;
&#13;

答案 1 :(得分:1)

<强>解决方案:

获取输入值,将其转换为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;

答案 2 :(得分:0)

只需按类评估范围,然后选择所需的子属性。

public DateTime GetDateTime()
{
    DateTime ret;
    while (true)
    {
        Console.Write("Date? ");
        var dte = Console.ReadLine();
        if (DateTime.TryParse(dte, out ret))
            return ret;
    }
}

答案 3 :(得分:0)

这应该得到您正在寻找的值:

 $('.btn input').last().data('url')
 $('.btn input').last().attr('id')