css 如何将模板永久转换为RTL？

brjng4g3 于 2023-06-25 发布在其他

关注(0)|答案(1)|浏览(109)

这是接口。我有将模板转换为RTL的选项，但在刷新页面时，它会返回到默认值，即LTR
这是JS：

var dzSwitcher = '
<div><p>Direction</p><select class="form-control" name="theme_direction" id="theme_direction"><option value="ltr">LTR</option><option value="rtl">RTL</option></select></div>'


(function($) {
    "use strict"
    addSwitcher();
    const body = $('body');
    const html = $('html');
    const themeDirectionSelect = $('#theme_direction');

    //change the theme direction (rtl, ltr) controller
    themeDirectionSelect.on('change', function() {
        html.attr('dir', this.value);
        html.attr('class', '');
        html.addClass(this.value);
        body.attr('direction', this.value);
    });

css

来源：https://stackoverflow.com/questions/76518306/how-do-i-permanently-convert-a-template-to-rtl

1条答案

按热度按时间

pokxtpni1#

为了让它跨页面持久化，你需要使用类似localStorage的东西。
我创建了一个用于改变方向的函数，以便它可以用于加载以及选择的改变。
最后，我检查本地存储，如果已经保存，我使用该值来更改方向，并将方向选择设置为该值。

const dzSwitcher = '<div><p>Direction</p><select class="form-control" name="theme_direction" id="theme_direction"><option value="ltr">LTR</option><option value="rtl">RTL</option></select></div>'
    
    
    const changeDirection = (direction) => {
      $("html").attr('dir', direction);
      $("html").attr('class', '');
      $("html").addClass(direction);
      $("body").attr('direction', direction);
      localStorage.setItem("direction",direction)
    };

    $("body").append(dzSwitcher)
    
    $(document).on("change", '#theme_direction', function() {
      changeDirection(this.value);
    });
    
    const savedDirection = localStorage.getItem("direction");
    

    if(savedDirection){
        changeDirection(savedDirection)
        $("#theme_direction").val(savedDirection)
    }

赞(0）回复(0）举报 2023-06-25

我来回答

css 如何将模板永久转换为RTL？

1条答案

相关问题

热门标签

最新问答