Question

我想用变量值jquery

更改span标签元素中的值

我的代码如下

<input type="file" name="pdffile" id="fileInput" class="form-control" placeholder="Browse" required>
<span id="pdf" style="display:none;"></span>

我有像这样的jquery

$str = $("#fileInput").val();
$splt = $str.split(".");
$('#pdf').text('Your Extension is'.$splt[1]);

为什么不起作用？

Answer 1

＆＃13;

$("#fileInput").change(function() {
  var qwe = $(this)[0].files;

  console.log(qwe[0].name.split('.').pop())// another option to get extension name
  $('#pdf').show().text('Your Extension is ' + qwe[0].name.slice(-3));

})

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="file" name="pdffile" id="fileInput" class="form-control" placeholder="Browse" required>
<span id="pdf" style="display:none;"></span>

＆＃13;

试试这种方式

Answer 2

您正在连接您的变量错误。您需要添加一个+并将点放在括号内。 display：none也隐藏了视图中的结果。

JSFiddle

<强> HTML

<input type="file" name="pdffile" id="fileInput" class="form-control" placeholder="Browse" required>
<span id="pdf"></span>

<强> JS / jQuery的

$("#fileInput").change(function(){
$str = $("#fileInput").val();
$splt = $str.split(".");
$('#pdf').text('Your Extension is .'+$splt[1]);
});

Answer 3

如果文件名包含文件名部分中的点，例如my.trip.pictures.jpg ...
我建议使用正则表达式来确保捕获最后一个点和扩展。

＆＃13;

$("#fileInput").change(function() {
  
  var ext = $(this).val().match(/(.+)(\..+)/)[2];

  $('#pdf').show().text('Your Extension is ' + ext);

})

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="file" name="pdffile" id="fileInput" class="form-control" placeholder="Browse" required>
<span id="pdf" style="display:none;"></span>

＆＃13;

如何使用变量值jquery更改span标记值

4 个答案: