Laravel Glyphicons

Question

我在这个项目中使用了Laravel 5.4。

按钮代码

<div class="modal-footer">
    <button type="button" class="btn btn-primary" data-dismiss="modal">I Agree</button>
</div>

使Button成为复选框的JS代码

$(function () {
$('.button-checkbox').each(function () {

    // Settings
    var $widget = $(this),
        $button = $widget.find('button'),
        $checkbox = $widget.find('input:checkbox'),
        color = $button.data('color'),
        settings = {
            on: {
                icon: 'glyphicon glyphicon-check'
            },
            off: {
                icon: 'glyphicon glyphicon-unchecked'
            }
        };

    // Event Handlers
    $button.on('click', function () {
        $checkbox.prop('checked', !$checkbox.is(':checked'));
        $checkbox.triggerHandler('change');
        updateDisplay();
    });
    $checkbox.on('change', function () {
        updateDisplay();
    });

    // Actions
    function updateDisplay() {
        var isChecked = $checkbox.is(':checked');

        // Set the button's state
        $button.data('state', (isChecked) ? "on" : "off");

        // Set the button's icon
        $button.find('.state-icon')
            .removeClass()
            .addClass('state-icon ' + settings[$button.data('state')].icon);

        // Update the button's color
        if (isChecked) {
            $button
                .removeClass('btn-default')
                .addClass('btn-' + color + ' active');
        }
        else {
            $button
                .removeClass('btn-' + color + ' active')
                .addClass('btn-default');
        }
    }

    // Initialization
    function init() {

        updateDisplay();

        // Inject the icon if applicable
        if ($button.find('.state-icon').length === 0) {
            $button.prepend('<i class="state-icon ' + settings[$button.data('state')].icon + '"></i>');
        }
    }
    init();
   });
});

结果：

​

​

问题：

如何更改链接以使其能够找到我Glyphicons文件夹

公共->字体-> Bootstrap -> (字形图标文件)

Answer 1

我知道这是一种愚蠢的方式，但它是有效的..

修改引导程序代码是非常关键的。

我所做的是更改App.css中Glyphicons的源路径

我的app.css是保存bootstrap代码的样式表。

这是我编辑代码的部分。

@font-face {
  font-family: Glyphicons Halflings;
  src: url(../fonts/bootstrap/glyphicons-halflings-regular.eot?f4769f9bdb7466be65088239c12046d1);
  src: url(../fonts/bootstrap/glyphicons-halflings-regular.eot?f4769f9bdb7466be65088239c12046d1) format("embedded-opentype"), url(../fonts/bootstrap/glyphicons-halflings-regular.woff2?448c34a56d699c29117adc64c43affeb) format("woff2"), url(../fonts/bootstrap/glyphicons-halflings-regular.woff?fa2772327f55d8198301fdb8bcfc8158) format("woff"), url(../fonts/bootstrap/glyphicons-halflings-regular.ttf?e18bbf611f2a2e43afc071aa2f4e1512) format("truetype"), url(../fonts/bootstrap/glyphicons-halflings-regular.svg?89889688147bd7575d6327160d64e760) format("svg")
}

正如您所看到的，源url不再是

src: url(.//fonts/glyphicons-halflings-regu...);

他们已经..。

src: url(../fonts/bootstrap/glyphicons-halflings-regu...);