2

配列から生成されたもののこのリストがあります。配列値は、データベース内のクエリにマップされる配列キーにマップされます。今私が直面している問題は、このリストが私のajax部分に含まれている場合、ページが更新される前に1回クリックするだけで機能することです。何が得られますか？

リンクのhref=""部分をクリックすると、HTML5HistoryAPIメソッドを使用してURLを変更しています。私は主にフロントエンド開発者であるため、jQueryに少し慣れていませんが、追いつく時間がありませんでしたが、このコードを壊すリンクリストは私には意味がありません。

$("a[rel='ajax']").click(function(e){
    //e.preventDefault();

    pageurl = $(this).attr('href');

    $.ajax({url:pageurl+'?rel=ajax',success: function(data){
        $('#ajax')
        .load(pageurl + ' #resultati');
    }});


    if(pageurl!=window.location){
        window.history.pushState({path:pageurl},'',pageurl);
    }
    return false;
});

リンクはPHPでこの関数を使用して生成されます。違いが生じる場合は、laravelフレームワークを使用しています。

public static function filterlink ($filter, $what)
{
    if (URI::segment(2) == 'make')
    {
        $first = URI::segment(3);
        $next = URI::segment(4);
    }
    else
    {
        $first = URI::segment(2);
        $next = URI::segment(3);
    }

    // what == 0 is the filter, what == 1 is the +filter. This reffers to the link being created.
    switch (substr($first, 0, 1))
    {
        case ' ': // example.ex/make/[+]current starts with a plus sign.
            if($what == 0)
                //new no+ filter.
            {
                return HTML::link('make/'.self::slug($filter.'/'.$first), $filter, array('rel' => 'ajax')); 
                // example.ex/make/+current => example.ex/make/newfilter/+current 
            } 
            elseif($what == 1) 
                //new +filter
            {
                return HTML::link('make/+'.self::slug($filter), $filter, array('rel' => 'ajax')); 
                // example.ex/make/+current+replaced+by+newfilter
            }
        break;


        default: 
            if($what == 0) 
            // new no+ filter.
            {
                if(!empty($next))
                {
                    return HTML::link('make/'.self::slug($filter.'/'.$next), $filter, array('rel' => 'ajax'));
                }
                else
                {
                    return HTML::link('make/'.self::slug($filter), $filter, array('rel' => 'ajax'));
                }
            }
            elseif($what == 1 && (!empty($first)))
            {
                return HTML::link('make/'.self::slug($first.'/+'.$filter), $filter, array('rel' => 'ajax'));
            }
            elseif($what == 1 && (empty($first)))
            {
                return HTML::link('make/+'.self::slug($filter), $filter, array('rel' => 'ajax'));
            }

        }
    }

リンクリストをajaxフィールドの外に配置しようとしました。これにより、退屈なページが更新されることなくajaxフローが続行されますが、リンクURLが更新されないことは明らかであり、片端リンクしか作成できず、壊れています。ページのデュアルフィルター機能。

どんな助けでも素晴らしいでしょう。

4

1 に答える 1

2

AJAX対応にしたいリンクを含むHTMLコンテンツを実際にロードしている場合は、.onを使用して、新しいリンクもjQuery関数に引き継がれるようにする必要があります。

$(document).on('click',"a[rel='ajax']",function(e) {

ここでの作業サンプル：

http://jsfiddle.net/hansvedo/cJW54/

ちょっと考えてみてください。pushState関数がある場所にpreventDefaultを配置するのはどうですか？それとも、それがどこにあるのかコメントを外すだけですか？PreventDefaultは、通常のリンクアクションが発生しないようにします。

if(pageurl!=window.location){
    e.preventDefault();
    window.history.pushState({path:pageurl},'',pageurl);
}
于 2012-12-20T17:18:59.747 に答える