Question

我正在尝试使用jquery来阻止页面重写。我有完整的代码php完成...并且功能齐全。如果你可以请转到http://www.jonathansconstruction.com/gallery3.php并点击不同的画廊SUbmenus类别查看全部，厨房等...我正在使用获取变量。但是，我想使用jquery来处理php，所以我不必将它包含在gallery.php中，并且还要防止页面重新加载，因为它会使页面重新启动，这可能会令人困惑。任何hlep将非常感谢THanks

更新，感谢所有帮助过的人：

到目前为止，我在网站上取得了进展，已在网站上修改了更正后的网址

一切都在流沙的效果上顺利进行.Howwever，Lytebox在放置流沙效果时不加载。，在开始时它加载得很好，但是在按下其中一个菜单后立即进行流沙效果。它停止工作。另外，我想按http://www.jonathansconstruction.com/gallery.php中的方式设置菜单按钮的样式。我看到jquery没有添加和

我下载的示例。还有那个说“画廊图片”在他的流沙演示中消失了。

感谢任何帮助。下面是我到目前为止修改过的script.js代码

$(document).ready(function(){

var items = $('.photo_show figure'),
    itemsByTags = {};

// Looping though all the li items:

items.each(function(i){
    var elem = $(this),
        tags = elem.data('tags').split(',');

    // Adding a data-id attribute. Required by the Quicksand plugin:
    elem.attr('data-id',i);

    $.each(tags,function(key,value){

        // Removing extra whitespace:
        value = $.trim(value);

        if(!(value in itemsByTags)){
            // Create an empty array to hold this item:
            itemsByTags[value] = [];
        }

        // Each item is added to one array per tag:
        itemsByTags[value].push(elem);
    });

});

// Creating the "Everything" option in the menu:
createList('View All',items);

// Looping though the arrays in itemsByTags:
$.each(itemsByTags,function(k,v){
    createList(k,v);
});

$('#gallery_menu nav a').live('click',function(e){
    var link = $(this);

    link.addClass('current').siblings().removeClass('current');

    // Using the Quicksand plugin to animate the li items.
    // It uses data('list') defined by our createList function:

    $('.photo_show').quicksand(link.data('list').find('figure'), {adjustHeight: 'dynamic'} );
    e.preventDefault();
});

$('#gallery_menu nav a:first').click();

function createList(text,items){

    // This is a helper function that takes the
    // text of a menu button and array of li items

    // Creating an empty unordered list:
    var ul = $('<ul>',{'class':'hidden'});

    $.each(items,function(){
        // Creating a copy of each li item
        // and adding it to the list:

        $(this).clone().appendTo(ul);
    });

    ul.appendTo('.photo_show');

    // Creating a menu item. The unordered list is added
    // as a data parameter (available via .data('list'):

    var a = $('<a>',{
        html: text,
        href:'#',
        data: {list:ul}
    }).appendTo('#gallery_menu nav');
}
  });

另一个编辑：

所有看起来很好到目前为止修复了许多问题，但是，由于某种原因，我在静态html消息中显示甚至html代码加载jquery流沙代码时的范围。??这是我在网站的html部分上的代码，由于某种原因没有出现在实时网站上。

<div id="portfolio">
                <div class="photo_show"><span>Gallery Pictures</span>

跨度部分没有出现，不知道为什么

我有TOp Part Resolvd。刚刚移动了photo_show div并编辑了定位... HOPEFULLY Last Edit 流沙的jquery让我的日历消失，检查，是的，这是一些jquery冲突，但不知道是什么原因导致它..也没有形式验证不起作用...任何帮助表示赞赏！

Answer 1

我在更正了字词construction的网址中的拼写错误后访问了您的网页链接。

我还看到点击时在查看全部，厨房上点击的问题，以及其他这是您想要阻止的内容。

不幸的是，这些按钮正在使用sorting filter 要求通过查询字符串重新加载带有过滤选项的网页。对于该过滤方法无法做任何事情，您只需重新加载网页，因为过滤是在页面加载时完成的。

也许这个DEMO会显示您想要完成的内容，因为它不会重新加载网页。该演示具有易于创建和维护的标记，使用 Quicksand jQuery插件构建。可以使用右下角的链接访问该演示的教程，但查看源HTML文件可以看出它是多么简单。

我使用 Quicksand和Shadowbox 制作了一个可下载的演示版，这是一个替代灯箱HERE，您可能会感兴趣，因为您的网页将过滤后的图标结果链接到名为{{的灯箱替代品3}}

由于您的编辑反映了您对 Lytebox 的兴趣，因此在使用Quicksand进行过滤事件后，以下标记将重新初始化该灯箱替代方案。相应地更新 script.js 文件。

URL Links

我还对现有的 adjustHeight 进行了更正，因为它使用的是分号而不是等号，但正确的位置和使用方法是针对不相关的内容。

您没有看到项目符号的原因是您没有使用该演示所使用的$('.photo_show').quicksand(link.data('list').find('figure'), function(){ adjustHeight = 'dynamic'; initLytebox(); });。

使用Jquery来阻止页面重新加载按下锚点

1 个答案: