0

Masonry を使用し、jQuery を使用して各グリッド要素をフルサイズの画像にリンクするポートフォリオ サイトに取り組んでいます (div 全体へのリンクを追加します)。

特定のグリッド要素はどこにもリンクしないはずなので、元のコードに触れずにそれらの要素のリンクを削除できるかどうか疑問に思っています. それぞれに独自のクラスがあり、セレクターとして使用できます。

私はremove()またはempty()を考えましたが、div を削除したくないので機能しません。関連付けられているリンクを無効にしたいだけです。

コード

申し訳ありませんが、HTML も JS 経由で構築されている巨大なファイルです。これは、時間がある人のための完全なファイルです: http://jsbin.com/UMILIXi/1/edit?js,output

要素テンプレートを作成する部分は次のとおりです。

//ITEM IMAGE TEMPLATE
                item: '<% if(item.gridInternalLink){ %>\
                <div class="' + o.itemClass + ' gridTextBox gridInternalLink" style="width:<%= width %>px;">\
                <p><%= item.gridTextBox %></p>\
                <% }else if(item.gridExternalLink){ %>\
                <div class="' + o.itemClass + ' gridTextBox gridExternalLink" style="width:<%= width %>px;">\
                <p><%= item.gridTextBox %></p>\
                <% }else if(item.gridNoLink){ %>\
                <div class="' + o.itemClass + ' gridTextBox gridNoLink" style="width:<%= width %>px;">\
                <p><%= item.gridTextBox %></p>\
                <% } else if(item.gridVideoLink){ %>\
                <div class="' + o.itemClass + '" style="width:<%= width %>px;">\
                <%= item.gridVideoLink %>\
                <% }else{ %>\
                <div class="' + o.itemClass + '" style="width:<%= width %>px;">\
                <img src="<%= item.image %>" width="<%=width%>"/>\
                <div class="' + o.itemInfoClass + '"><div class="' + o.itemTextClass + '">\
                <% if(item.link){ %><a href="<%= link %>" rel="<%= rel %>" title="<%= title %>"><% } %>\
                <div class="text-wrapper">\
                <% if(item.cat){ %>\
                <h3 class="post-info"><%=item.cat%></h3>\
                <% } %>\
                <h2><%= item.title %></h2></div><div class="view-gallery">\
                <% if(item.imgnum){ %><span class="item-num"><%= item.imgnum %></span><% } %>\
                <span class="grid-gallery-icon<%= additionalClass %>"></span><span class="view-text"><%= viewText %><span class="more-arrow">&raquo;</span></span>\
                </div><% if(item.link){ %></a><% } %>\
                </div></div>\
                <% } %>\
                </div>'
4

4 に答える 4

0

The point where you are conditionally adding the anchor tag, can you not check for the gridNoLink property as well and accordingly add an anchor or a span?

Something like:

<% if(item.gridNoLink) { %>
  <span>
<% } else if(item.link){ %>
  <a href="<%= link %>" rel="<%= rel %>" title="<%= title %>">
<% } %>\
<div class="text-wrapper">\
...desired markup
</div>
<% if(item.gridNoLink) { %>
  </span>
<% } else if(item.link){ %>
  </a>
<% } %>\

This way no additional script would be required to handle tiles with no link. Also, it will ensure that you don't end up with anchor tags that change the cursor on hover but don't trigger any action on click.

于 2013-11-05T12:07:16.467 に答える
0

このコードを使用して、div の href を削除します

$('.linkClass').attr('href','#');
于 2013-11-04T10:44:50.483 に答える
0

リンクのデフォルトのアクションを単純に防止できます。

$('#container').on('click', '.linkClass', function(e){
   e.preventDefault();
});
于 2013-11-04T10:36:59.677 に答える