2

このコードは、フィルタリング可能なポートフォリオ用です。もともと私は次と前のリンク用にPHPを持っていましたが、ポートフォリオがフィルタリングされると、次のフィルタリングされたオブジェクトが見つかりません。フィルタがリストアイテムをDOM内で隣り合わせに配置していることがわかったので、next()を使用して結果を取得しました。ただし、リンクが正しく読み込まれていません。シックボックスをロードする同じページ上のリンク。新しいウィンドウで開いてウィンドウのURLに追加することに成功しましたが、動作させようとしているサイコロはありません。これがそのポートフォリオのアドレスです。

http://blurosemedia.com/portfolio

$(document).ready(function(){
    $(".portfolio-next").click(function(e) {
    var $this = $(this);
    if($this.data('clicked', true)) {
    var namer = $(this).attr('value');
    var url = $(this).parents('body').children('#wrap').children('#inner').children('#content-sidebar-wrap').children('#content').children('ul#portfolio-list').children().next('.portfolio-item-' + namer).nextAll('.portfolio-item:not(:.isotope-hidden)').attr('id');
        window.location.load(url);
        e.preventDefault();
   }
        });
});

シックボックスコードがページの下部に自動的に表示されるため、ダウツリーまでずっと登らなければなりませんでした。私が考えた解決策の1つは、thickboxをロードするには、class="thickbox"が必要だと考えました。どういうわけかload(url).withClass('thickbox')と言えばうまくいくかもしれませんが、構文はどうあるべきかは確かです。

4

2 に答える 2

0

整理しなければならないことがたくさんありますが、正しい道に進むのに役立つ情報を次に示します。

1)

window.location.loadは終了しません。探しているのは次のwindow.location.hrefとおりです。

MDNのドキュメントを参照してください

MSDNのドキュメントを参照してください

例えば、 window.location.href = url;


2)

さらに、

ID および NAME トークンは文字 ([A-Za-z]) で始まる必要があり、その後に任意の数の文字、数字 ([0-9])、ハイフン ("-")、アンダースコア ("_") を続けることができます、コロン (":")、およびピリオド (".")。

で始まる ID で li を設定しています#

詳細については、このリンクを参照してください。

これに対する回避策:

<li id="#TB_inline?height=450&width=900&inlineId=id-3" class="portfolio-item design portfolio-item-3 isotope-item">...</li>

次のことができます。

<li class="portfolio-item design portfolio-item-3 isotope-item">
 <span style="display:none;">#TB_inline?height=450&width=900&inlineId=id-3</span>
</li>

3)

理由もなくDOMを上下に移動しています。アイテムのラッパーに ID が存在するため ( #portfolio-list)、それをターゲットにしてそこから開始できます。

また、

('.portfolio-item:not(:.isotope-hidden)')

次のようにする必要があります。

('.portfolio-item:not(.isotope-hidden)')

を使用 :not(:something)して、次のような特定の状態の要素をターゲットにするために使用されます:checked

詳細については、このリンクを参照してください。


4)

変数namerは開いているアイテムの現在の ID を取得し、次のアイテムに渡したいので、コードは次のようになります。

$(document).ready(function(){
  $(".portfolio-next").click(function(e) {
    e.preventDefault();

    var $this = $(this);

    var namer = parseInt($this.attr('value'))+1;
    var url   = $this.attr("href");
        url   = url.substring(0, url.indexOf('=id'));
     
   window.location.href(url+"=id"+namer);
  });
});

このフィドルの例を参照してください!

タグにaは属性がないvalueため、無効なマークアップであることに注意してください。

詳細については、このリンクを参照してください。

于 2012-05-27T04:08:04.270 に答える
0

詳細なご回答ありがとうございます。jQueryに本格的に飛び込むのはこれが初めてです。これは私が思いついたものです:

<?php echo '<a href="#TB_inline?height=450&amp;width=900&amp;inlineId=id-" class="thickbox     
portfolio-previous" value="'; echo $portnum; echo '">Previous</a>';echo '<a 
href="#TB_inline?height=450&amp;width=900&amp;inlineId=id-" class="thickbox portfolio-
next" value="'; echo $portnum; echo '">Next</a>';?>

    //Next Portfolio Button
$(".portfolio-next").hover(function(e) {
e.preventDefault();
var $this = $(this);
//Get the value of the link which is the same value as the current list item
var namer = parseInt($this.attr('value'));
//Find the current div in the dom and find the list item id next to it
var falcon = $('ul#portfolio-list').children('.portfolio-item-' +    
namer).nextAll('.portfolio-item:not(:.isotope-hidden)').attr('id');

//Find the href tag  id and add the value from falcon
var url   = $this.attr("href");
url   = url.substring(0, url.indexOf('=id'));
if(falcon === undefined) {
var falcon2 = $('ul#portfolio-list').children('.portfolio-item-' +   
namer).prevAll('.portfolio-item:not(:.isotope-hidden):first').attr('id');
$(this).attr('href', url+"=id-"+falcon2);
}else{
$(this).attr('href', url+"=id-"+falcon);
return;
}
});

//Previous Portfolio Button

$(".portfolio-previous").hover(function(e) {
e.preventDefault();
var $this = $(this);
//Get the value of the link which is the same value as the current list item
var namer = parseInt($this.attr('value'));
//Find the current div in the dom and find the list item id next to it
var falcon = $('ul#portfolio-list').children('.portfolio-item-' +     
namer).prevAll('.portfolio-item:not(:.isotope-hidden)').attr('id');

//Find the href tag  id and add the value from falcon
var url   = $this.attr("href");
  url   = url.substring(0, url.indexOf('=id'));
  if(falcon === undefined) {
  var falcon2 = $('ul#portfolio-list').children('.portfolio-item-' +   
namer).nextAll('.portfolio-item:not(:.isotope-hidden):last').attr('id');
  $(this).attr('href', url+"=id-"+falcon2);
}else{
$(this).attr('href', url+"=id-"+falcon);
return;
}
});

それはうまくいきますが、最適化する方法についての提案は大歓迎です。

于 2012-05-28T01:36:41.620 に答える