0

modx rev 2.2.0で作成されたページでユーザーが変更できる2つのオプションがあります
*背景
*フォントサイズ

背景とフォントサイズを変更するにはjqueryを使用したので、ajaxを使用するのが最善の方法だと思います。したがって、これらの変数をセッションに追加する 1/2 ページを作成する必要があるため、ユーザーが別のページに移動しても、背景とフォント サイズは同じままです。また、ユーザーが数日後にページにアクセスした場合、背景とフォント サイズは同じままです。

ここに私のJavaScriptコードがあります:

<script type="text/javascript">
 $(document).ready(function () {
  background5();
    var originalFontSize = $('html').css('font-size');
 });

 function background1() { $('.wrap').css("background","url(assets/templates/default/images/bg1.jpg)"); return false; }
 function background2() { $('.wrap').css("background","url(assets/templates/default/images/bg2.jpg)"); return false; }
 function background3() { $('.wrap').css("background","url(assets/templates/default/images/bg3.png)"); return false; }
 function background4() { $('.wrap').css("background","url(assets/templates/default/images/bg4.jpg)"); return false; }
 function background5() { $('.wrap').css("background","url(assets/templates/default/images/bg5.jpg)"); return false; }
 function background6() { $('.wrap').css("background","url(assets/templates/default/images/bg6.jpg)"); return false; }
 function background7() { $('.wrap').css("background","url(assets/templates/default/images/bg7.jpg)"); return false; }
 function background8() { $('.wrap').css("background","url(assets/templates/default/images/bg8.jpg)"); return false; }
 function background9() { $('.wrap').css("background","url(assets/templates/default/images/bg9.jpg)"); return false; }
 function big_font() {
  var currentFontSize = $('html').css('font-size');
  var currentFontSizeNum = parseFloat(currentFontSize, 10);
  var newFontSize = currentFontSizeNum*1.1;
  $('html').css('font-size', newFontSize);
  return false;
 }
 function small_font() {
  var currentFontSize = $('html').css('font-size');
  var currentFontSizeNum = parseFloat(currentFontSize, 10);
  var newFontSize = currentFontSizeNum*0.9;
  $('html').css('font-size', newFontSize);
  return false;
 }
</script>

私の質問は、modx でセッションに変数を追加する方法です。これを行う最善の方法は何ですか?

4

1 に答える 1

1

Ajax スタブとして使用するリソースを作成し、その上に「セッションに追加」コードを含むキャッシュされていないスニペットを配置します。スニペットは次のように単純です。

<?php
// example only, be sure to sanitize and add some sensible defaults here
$background = $_POST['background'];
$fontSize   = $_POST['font_size'];

// write to user's session
$_SESSION['background'] = $background;
$_SESSION['fontSize'] = $fontSize;

return '';

background次に、jQuery を使用してスタブへの Ajax 呼び出しを作成し、パラメーターとfont_sizeパラメーターを渡します。

var background = 6,
    fontSize = 2;
// let's assume your Ajax stub resource id is 7
$.post("[[~7]]", { background: background, font_size: fontSize } );

background()注: 次のような関数を 1 つだけ使用して、これらすべての関数を整理できます。

function background(n) {
    var url = "assets/templates/default/images/bg"+parseInt(n)+".jpg";
    $('.wrap').css("background","url("+url+")"); 
    return false; 
}
于 2012-07-10T04:59:17.213 に答える