2

私のページでは、prototypejsを使用してAjaxタブを使用しています。そしてそれらの1つにはソート可能が含まれています。ソート可能は個別に機能しますが、タブに入れると機能しません。どうすればこの問題を解決できますか？ありがとう。

私のタブは次のとおりです。

<div id="container">
<div class="tabs" id="tab1">Tab 1</div>
<div class="tabs" id="tab2">Tab 2</div>
<div class="tabs" id="tab3">Tab 3</div>
</div>

私のソート可能なリストは次のとおりです。

<ul id="list">
    <li>now</li>
    <li>works</li>
    <li>this</li>
</ul>

<script type="text/javascript">
    Sortable.create("list");
</script>

私のajax関数は次のとおりです

function init () {

    var tabs = document.getElementsByClassName('tabs');
   for (var i = 0; i < tabs.length; i++) {
    $(tabs[i].id).onclick = function () {
        getTabData(this.id);
    }
}
}
function getTabData(id) {
var url = 'demos/ajax-tabs/process.php';
var rand = Math.random(9999);
var pars = 'id=' + id + '&rand=' + rand;

var myAjax = new Ajax.Request( 
        url, {
              method: 'get', 
              parameters: pars, 
              onLoading: showLoad, 
              onComplete: showResponse
              });

}
function showLoad () {
$('load').style.display = 'block';
    Sortable.create("list");

}
function showResponse (originalRequest) {
//Sortable.create("list");
var newData = originalRequest.responseText;
$('load').style.display = 'none';
$('content').innerHTML = newData;


}
init();
4

1 に答える 1

0

Sortable.create（ "list"）;を呼び出す場合 関数の場合、IDが「list」のすべての要素をページで検索してemを並べ替え可能にします。

ただし、Ajaxでは、新しいコンテンツに並べ替え可能ファイルを再度適用する必要があるため、コンテンツが正常に読み込まれた後、Sortable.create（）を再度呼び出す必要があります。

function showResponse (originalRequest) {
    var newData = originalRequest.responseText;
    $('load').style.display = 'none';
    $('content').innerHTML = newData;   // make sure that newData contains <ul id="list">.....</ul>
    Sortable.create("list");
}
于 2012-05-29T07:21:43.273 に答える