Javascript 样式化tomahawk上载文件组件

我正在尝试设置

t:inputFileUpload

元素的样式，我尝试了这个解决方案，它将另一个输入元素和一个图像放置在

t:inputFileUpload

所占据的相同位置。这就是我的代码

<div id="file-div">
    <h:inputText styleClass="replace-upload" id="fake-input" />
        <div class="browse-img">
            <span class="browse-button">#{msgs.select}</span>
        </div>
    <t:inputFileUpload id="file" value="#{createListBean.uploadedFile}"
        size="22" accept=".xls,.xlsx,.csv" type="file" style="z-index :2;opacity:0;position:relative;"
        onchange="changeFakeFile()" styleClass="file-real" />
</div>

现在当用户点击假输入元素时，他实际上会点击tomahawk元素，主要问题是他选择的路径没有显示假输入，这就是为什么我在it函数中添加了一些javascript

changeFakeFile(){
    var x = $('.file-real').val();
    $('.replace-upload').text(x);}

---

问题是伪输入值已更改，但该值未显示给用户，如何使其显示

我替换了

$（'.replace upload'）。文本（x）带有
$（'.replace upload'）.val（x），它工作了。
$（'.replace upload'）.val（$（'.file real'）[0]。文件[0]。名称）；或者，您只需要更改val（）。[0]引用了哪些文件？
changeFakeFile(){
    var x = $('.file-real').val();
    $('.replace-upload').text(x);}