5
私はWebアプリケーションを開発しており、JQueryのUIタブ、特にバインドされたajaxリクエストのターゲットURLを動的に更新する 'url'メソッド各タブ。Jquery UI 1.9のタブで 'url'メソッドを置き換える
2つのタブ、関数1 &関数2のそれぞれは、テストに渡されたパラメータに基づいていくつかのテストの結果を表示します。テストは全体にわたって同じですが、タブにバインドされたURLを操作することで、関数で使用される変数を変更していました。遅延読み込みタブで呼び出されているURLを更新する 'url'メソッドはこれを可能にしましたが、現在は廃止されており、まもなくサポートされません。そこで私はJQuery UI 1.9で 'beforeLoad'イベントを使ってこれを行う方法を探していました。
データパラメータを設定するためにui.ajaxSettingsを操作する可能性がありましたが、バグ（http://bugs.jqueryui.com/ticket/8673）があり、修正されないようです。回避策として、代わりにui.ajaxSettings.urlを操作することをお勧めします。
私の実際の例は以下の通りですが、これが私が後にしたことを達成する最もクリーンで最も適切な方法であるかどうかはわかりません。私はこれほど多くのことをする方法の例を見つけるのに苦労したので、似たような状況で他の人を助けてくれるでしょう。
<title> Jquery Tabs AJAX Test</title>
<script type="text/javascript" src="js/jquery-1.8.2.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.9.1.custom.js"></script>
<link rel="stylesheet" type="text/css" href="css/smoothness/jquery-ui-1.9.1.custom.css">
</head>
<body >
<script type=text/javascript>
$(document).ready(function() {
$('#tabs').tabs({ });
$('button.set_variable').click(function() {
var variable = $(this).val();
$('#tabs').tabs({
beforeLoad: function(event, ui) {
ui.ajaxSettings.url += "&variable=" + variable ;
}
});
var selected_tab = $('#tabs').tabs('option', 'selected');
$('#tabs').tabs("load", selected_tab);
});
})
</script>
<button class="set_variable" value="1">Variable = 1</button>
<button class="set_variable" value="2">Variable = 2</button>
<button class="set_variable" value="3">Variable = 3</button>
<div id="tabs" >
<ul>
<li><a href="ajax.php?func=ajax-func1">Function 1 </a></li>
<li><a href="ajax.php?func=ajax-func2">Function 2 </a></li>
</ul>
</div>
</body></html>
N.B.ここにあるajax.phpファイルは、渡されたものだけをエコーバックします。
<?php
extract($_GET);
var_dump($_GET);
?>
私は[jsfiddle]（http://jsfiddle.net/DNWzY/）やったことのために – Shikiryu