更改多个输入的标签文本

我有一个动态页面，可以有很多input[type="file"]字段。选择文件后，我需要更改每个输入的标签。更改多个输入的标签文本

所以，对于每一个输入，如果有：

空：文本= “上载”;
选定的文件：文本=文件的名称。

这里是HTML的一个示例：

<label for="upload-qm1"> 
    <span class="button">upload</span> 
    <input id="upload-qm1" type="file" accept=".pdf, .doc"> 
</label>

我知道如何为一个单一的input做到这一点，使用此代码：

$('label[for="upload-qm1"] span').text($(this).val());

不过，我不知道如何许多input字段，我将在我的页面上。我试过这样的事情：

$(this).parent('label').find('span').text($(this).val());

但不幸的是它不起作用。任何关于如何获得更改所有input字段的方法的帮助？

来源

2016-04-22 Cthulhu

您可以使用DOM遍历来查找input已更改的相关span。试试这个：

$('input:file').change(function() { 
    $(this).prev('span').text($(this).val()); 
})

Working example

来源

2016-04-22 11:04:40

的大部分代码，你试过IST corret。问题是你已经为parent()函数设置了一个参数。

尝试这样： $(this).parent('label').find('span').text($(this).val());

另外，还要确保$(this)是输入字段没有标签本身，如果您单击标签$(this)上是标签。

来源

2016-04-22 11:06:57

$('input[type="file"]').on('change', function() { 
 
     id = $(this).attr('id'); 
 
      console.log("change event") 
 
     var file = $('#'+id).val().split('\\').pop(); 
 
     if(file!='') { 
 
      $('label[for="'+id+'"] span').text(file) 
 
     } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<label for="upload-qm1"> 
 
    <span class="button">upload</span> 
 
    <input id="upload-qm1" type="file" accept=".pdf, .doc"> 
 
</label>

来源

2016-04-22 11:32:14

更改多个输入的标签文本

回答

相关问题