Question

我想将此变量插入javascript函数

     `var newURL = window.location.protocol + "//" + window.location.host + "/" + window.location.pathname;`

这是功能

var settingsHandler = function() {
    var clipSetting = new Object, appSetting = new Object;
    clipSetting = {
        fixedHeader: true,
        fixedSidebar: true,
        closedSidebar: false,
        fixedFooter: false,
        theme: 'theme-1'
    };
    if($.cookie) {
        if($.cookie("clip-setting")) {
            appSetting = jQuery.parseJSON($.cookie("clip-setting"));
        } else {
            appSetting = clipSetting;
        }
    };

    appSetting.fixedHeader ? app.addClass('app-navbar-fixed') : app.removeClass('app-navbar-fixed');
    appSetting.fixedSidebar ? app.addClass('app-sidebar-fixed') : app.removeClass('app-sidebar-fixed');
    appSetting.closedSidebar ? app.addClass('app-sidebar-closed') : app.removeClass('app-sidebar-closed');
    appSetting.fixedFooter ? app.addClass('app-footer-fixed') : app.removeClass('app-footer-fixed');
    app.hasClass("app-navbar-fixed") ? $('#fixed-header').prop('checked', true) : $('#fixed-header').prop('checked', false);
    app.hasClass("app-sidebar-fixed") ? $('#fixed-sidebar').prop('checked', true) : $('#fixed-sidebar').prop('checked', false);
    app.hasClass("app-sidebar-closed") ? $('#closed-sidebar').prop('checked', true) : $('#closed-sidebar').prop('checked', false);
    app.hasClass("app-footer-fixed") ? $('#fixed-footer').prop('checked', true) : $('#fixed-footer').prop('checked', false);
    $('#skin_color').attr("href", "assets/css/themes/" + appSetting.theme + ".css");
    $('input[name="setting-theme"]').each(function() {
        $(this).val() == appSetting.theme ? $(this).prop('checked', true) : $(this).prop('checked', false);
    });
    switchLogo(appSetting.theme);

    $('input[name="setting-theme"]').change(function() {
        var selectedTheme = $(this).val();

        $('#skin_color').attr("href", "assets/css/themes/" + selectedTheme + ".css");
        switchLogo(selectedTheme);
        appSetting.theme = selectedTheme;
        $.cookie("clip-setting", JSON.stringify(appSetting));

    });

这是两行编码，我想更改它以建立链接动态地有可能吗？

$('#skin_color').attr("href", "assets/css/themes/" + appSetting.theme + ".css");
$('#skin_color').attr("href", "assets/css/themes/" + selectedTheme + ".css");

类似的东西

$('#skin_color').attr("href", newURL + "assets/css/themes/" + appSetting.theme + ".css");
$('#skin_color').attr("href", newURL + "assets/css/themes/" + selectedTheme + ".css");

Answer 1

如果您打算将其插入显示的函数中，则只需添加它并使用变量即可：

var newUrl = window.location.protocol + "//" + window.location.host + "/" + window.location.pathname;
//note the added / in front of assets to make sure proper directory separation
//in final string
$('#skin_color').attr("href", newUrl+"/assets/css/themes/" + selectedTheme + ".css");

否则，如果您指的是它自己的功能：只需在函数中返回该字符串串联，然后调用函数代替CSS url字符串

function getBase(){
  return window.location.protocol + "//" + window.location.host + "/" + window.location.pathname;
}

$('#skin_color').attr("href", getBase()+"/assets/css/themes/" + selectedTheme + ".css");

或者如果您愿意，甚至可以通过相对路径

function createAbsoluteUrl(relativePath){
  var base = window.location.protocol + "//" + window.location.host + "/" + window.location.pathname;
  return base+"/"+relativePath;
}

var relativeThemeUrl = "assets/css/themes/" + selectedTheme + ".css";

$('#skin_color').attr("href", createAbsoluteUrl(relativeThemeUrl));

JavaScript中的动态URL和URL部件

1 个答案: