3

少し問題があります。ローカルストレージを使用して値をロードしています。その値でスライダーが変化するという考えです。ロード部分を正しく取得し、必要な数をロードします（アラートに表示できるので、問題ないことがわかります）が、スライダーをその数で配置しようとすると、ダフルト値のままになります（試してみます非アクティブ化しても問題は同じです）。このメソッドは、ページの準備ができたときに実行されます。コードは次のとおりです。

function mostrarValoresOpcionesGuardados()
{

    var localStorageKey1 = "nombreUsuario";
    var localStorageKey2 = "pesoUsuario";
    var localStorageKey3 = "alturaUsuario";
    var localStorageKey4 = "edadUsuario";
    var nombre = localStorage.getItem(localStorageKey1);
    var peso = localStorage.getItem(localStorageKey2);
    var altura = localStorage.getItem(localStorageKey3);
    var edad = localStorage.getItem(localStorageKey4);
    $("#nombreUsuarioOpciones").val(nombre);
    $("#pesoUsuario").val(peso).slider("refresh"); //this doesn't work
    $("#alturaUsuario").val(altura);
    $("#edadUsuario").val(edad);
    alert(nombre+" "+peso+" "+altura+" "+edad);
};

私もこの方法を試します： $("#pesoUsuario").val(peso); $("#pesoUsuario).slider("refresh")); しかし、それもうまくいきません。これは、スライダーの div です。

<div data-role="fieldcontain">
        <label for="pesoUsuario">
            Peso (kg)
        </label>
        <input id="pesoUsuario" type="range" name="pesoUsuario" value="95" min="0"
        max="200" data-highlight="true">
    </div>
4

2 に答える 2

2

あなたのコードは今エラーを投げているに違いありません:

初期化の前に「リフレッシュ」を呼び出すことはできません

それ（およびあなたの問題）を修正するには、次のように ing するslider前にを初期化する必要があります。refresh

 $("#pesoUsuario").val(peso).slider().slider("refresh");

編集 ：

あなたのコードでは、これをやっています：

$(document).ready(mostrarValoresOpcionesGuardados()); //2 times

そこにあっては()なりません。理由は、jQuery では関数を呼び出すのではなく、コールバックとして渡すためです。次の 2 つのことを行う必要があります。

  1. readyイベントを次のように 変更します。

    $(document).ready(mostrarValoresOpcionesGuardados);

  2. ready最後の行のイベントを削除します。

ここにデモがあります：http://jsfiddle.net/k7C26/8/

これはあなたのケースでは機能しますが (フィドルに複数のページがないため)、pageinitイベントを通じて機能するようにコードを構造化する必要があります。こちらです、

  1. 傘の下にある 1 つのページのすべてのマークアップをカスタマイズできます。たとえば、クリック イベント、 の検証<button/>、ページ<input/>内のopcionesをページ コンテナーにバインドできます。このようにして、すべてのコントロールが合理化され、管理しやすくなります。
  2. DOM の準備が整う前にpageinitイベントが発生し、DOM の一部のみをロードするため、 DOM を使用するよりも高速ですready。
  3. DOMreadyはページ内のすべての要素を初期化しますが、これはajaxjQM のインジェクション メソッドを使用する場合には望ましくありません。を使用pageinitすると、正しいページのみがロードされ、 を介して他のページがロードされますajax。

再構築する方法は次のとおりです。

$(document).on("pageinit", "#opciones", function () {
    //bind click event to page, delegate from there
    $(this).on('click', "#botonGuardarOpciones", guardarDatosOpciones);
    //call function which loads data from localStorage
    mostrarValoresOpcionesGuardados();
});

このデモは次のとおりです。http://jsfiddle.net/hungerpain/k7C26/9/

于 2013-07-29T20:32:50.877 に答える