Bootstrap Filestyle-更改文件字段的按钮文本'不起作用

Bootstrap Filestyle - Changing button text for file field doesn't work

本文关键字:文本 不起作用 按钮 Filestyle- 文件 字段 Bootstrap      更新时间:2023-09-26

我想在Bootstrap 2.3.2中的Bootstrap Filestyle插件中更改文件字段的按钮文本,但它不起作用,按钮的文本仍然是默认的。我通过替换jquery中的元素来创建文件字段,并尝试通过属性data-buttonText或方法$("#changeAccountsSourceModal :file").filestyle('buttonText', 'Choose address'); 设置文本

jsfiddle样本

文件字段

$("#changeAccountsSourceModal .form-horizontal").replaceWith("<input type='"file'" class='"filestyle'" data-input='"true'" data-buttonText='"Choose address'">");
$("#changeAccountsSourceModal :file").filestyle();

只是通过在启动文件样式时在对象中传递选项来尝试一下,效果很好。

$("#changeAccountsSourceModal :file").filestyle({buttonText: 'Choose address'});

具有讽刺意味的是,当你试图更改吹嘘的后记时,文本只会添加到按钮上。

$("#changeAccountsSourceModal :file").filestyle('buttonText', 'Choose address');

小提琴

工作小提琴

您可以更改按钮文本、删除图标、占位符和更多

$(document).ready(function () {
    $("#myInputId").fileinput({
        mainClass: "input-group-md",
        showUpload: false,
        previewFileType: "image",
        browseClass: "btn btn-sucess",
        browseLabel: "Select Photo",
        browseIcon: "<i class='"icon-picture'"></i> ",
        removeClass: "btn btn-danger",
        removeLabel: "Delete",
        removeIcon: "<i class='"icon-trash'"></i> ",
        uploadClass: "btn btn-info",
        uploadLabel: "Upload",
        uploadIcon: "<i class='"icon-upload'"></i> ",
        msgPlaceholder: "Select Photo"
    });
});