JavaScript 在 anchor 单击时显示输入类型文件

Question

我的代码如下:

 <div class="fifty">
    <label>Credit report</label>
    <input type="hidden" id="credtireport-link" name="credtireport-link" value="<?php echo $creditreport; ?>">

    <input type="file" name="creditreport" id="creditreport" <?php if($creditreport!=""){?> style="display:none" <?php } ?> >
    <?php if($creditreport!="") { ?>
    <a href="#" onclick="showfile();">Edit File</a>
    <?php } ?>
  </div>
  <div class="fifty">
    <label>Employer’s ref</label>
    <input type="hidden" id="employerref-link" name="employerref-link" value="<?php echo $employeer_ref_url; ?>">

    <input type="file" name="employerref" id="employerref" <?php if($employeer_ref_url!=""){?> style="display:none" <?php } ?>>
     <?php if($employeer_ref_url=="") { ?>
    <a href="#" onclick="showfile();">Edit File</a>
    <?php } ?>
  </div>

我想用 JavaScript 编写一个函数，在编辑文件 anchor 单击时调用该函数，并显示相应的输入类型文件。

说明:如果有人点击信用报告的 anchor ，那么它应该只显示 <input type="file" name="creditreport" id="creditreport"> 。

我的 JavaScript 代码:

function showfile()
{
    var id=$(this).parent().find('input[type="file"]').toggle();
    return false;
}

Answer 1

html

<a href="#" onclick="showfile(this);">Edit File</a>

JavaScript

function showfile(el) {
  var id = $(el).prev(":file").toggle();
  return false;
}

plnkr http://plnkr.co/edit/MjZkZvFjlqj4a8HffYaF?p=preview