1

これが私が達成しようとしていることです。このページhttp://livinginspace.staging.wpengine.com/には、4 つの共有ボタンがあります。最初の 3 つはまったく問題なく動作しますが、houzz は 1 つの画像に対してしか機能しません。私が達成しようとしているのは、現在のスライドに応じてボタンの href 属性を動的に変更することです。そのため、ボタンを押すと、houzz ボタンを押したときに画面に表示されていたスライドが共有されます。お気づきのように、ボタンの href 内で変更する必要があるのは画像の URL だけです。また、変更される唯一のもの (少なくとも私が気づいたこと) は、スライダー div 内の li 要素の z-index です。私の手順は次のとおりです。//最初に、z-index 20 の li をターゲットにしています。

var currLi = $('li').filter(function() {
return $(this).css('z-index') == 20;
});

//次に、そのli内の画像のURLをターゲットにします

var imgUrl = $(currLi + '>div.slotholder>img').attr('src');

//最後に、Houzz ボタンに URL を入力します

$('a.sb_network_button.houzz').attr("href", "http://www.houzz.com/imageClipperUpload?link=http%3A%2F%2Flivinginspace.staging.wpengine.com%2F&source=button&hzid=4036&imageUrl=" + imgUrl + "&title=Product+Title+as+it+will+be+seen+inside+Houzz&ref=http%3A%2F%2Flivinginspace.staging.wpengine.com%2F");

つまり、次のとおりです。

jQuery(document).ready(function($) {

var currLi = $('li').filter(function() {
return $(this).css('z-index') == 20;
});

var imgUrl = $(currLi + '>div.slotholder>img').attr('src');

$('a.sb_network_button.houzz').attr("href", "http://www.houzz.com/imageClipperUpload?link=http%3A%2F%2Flivinginspace.staging.wpengine.com%2F&source=button&hzid=4036&imageUrl=" + imgUrl + "&title=Product+Title+as+it+will+be+seen+inside+Houzz&ref=http%3A%2F%2Flivinginspace.staging.wpengine.com%2F");
});

私はjqueryにかなり慣れていないので、試したことをすべて覚えているわけではありませんが、できる限りのことをしましたが、まだ機能しません。また、コードをフッターの最後に配置すると、まったく機能しないことに気付きました (テストのためだけにアラートを配置しようとしました) が、ヘッダーまたはフッターの先頭にある場合 (他のすべての前に)スクリプト) アラートは機能しますが、ターゲットにしようとしている実際の li 要素がまだ作成されていないことが問題である可能性があると思います。私を助けてください、私はこれを理解しようとして何時間も費やしました。どうもありがとう

4

1 に答える 1