重命名没有id的按钮文本

Question

我有html：

<div class="k-button k-upload-button">
<input id="files" name="files" type="file" data-role="upload" autocomplete="off">
<span>Select files...</span>
</div>

高于html的文字（标签），我无法改变。

我只是想改变文字：

Select files...

致：

Select file

为此我试过：

$(".k-button.k-upload-button").find("span").text("Select file");

但这没效果。

请帮帮我。我怎样才能改变文字???

EDIT1：

.k-upload-button span:before {
    content: 'Select File';
     position: relative;
     left: 4444px;
    display: inline;
}
.k-upload-button span {
    position: relative;
   left: -4444px;
  display: inline;
}

Answer 1

CSS解决方案

从视口中移除范围，并将其伪子项放回原位。

Have an example!

CSS

.k-upload-button span {
    position: relative;
    left: -9999px;
}
.k-upload-button span:before {
    content: 'Select file';
    position: relative;
    left: 9999px;
}

Answer 2

试试这个

document.getElementById("files").innerHTML  = "Select file";

Answer 3

只需使用.find

即可

$('.k-button').find('span').html('Select File');

或使用.parent()

$('.k-button').parent().find('span').html('Select File');

或者不是努力选择一个元素，为什么不给自己一个id

$('#d-span').html('Select File');

jsfiddle here

希望有所帮助

Answer 4

$("span",$('.k-button').parent()).text("New Text");