我必须复制此功能吗？ - jQuery

我正在使用此函数为基于Web的移动应用程序创建透明的当前div上的信息覆盖图。我必须复制此功能吗？ - jQuery

背景：使用jQTouch，所以我有单独的div，而不是单个页面加载新的。

$(document).ready(function() { 
    $('.infoBtn').click(function() { 
     $('#overlay').toggleFade(400); 
     return false;  
    }); 
});

应该理解的是JS会按顺序运行，当我点击第一个div功能工作正常的按钮。当我进入下一个div时，如果我点击相同的按钮，当这个div显示时什么也不会“发生”，但是如果我回到第一个div，它实际上已经在这个页面上触发了它。

因此，我逻辑上复制了该函数并更改了CSS选择器名称，它适用于两者。

但是我必须为每次使用做到这一点吗？有没有办法使用相同的选择器，但在每个变体中加载不同的内容？

来源

2010-02-22 Josh

会是这样的工作？我假设你想要的是不同的按钮在不同的覆盖div上调用toggleFade。

function makeOverlayHandler(selector) { 
    return function() { 
     $(selector).toggleFade(400); 
     return false; 
    } 
} 

$('button selector').click(makeOverlayHandler('#overlay1')); 
$('another button selector').click(makeOverlayHandler('#overlay2'));

你也可以改变makeOverlayHandler的selector参数到jQuery对象，而不是一个选择，并调用它像这样：makeOverlayHandler($('#overlay1'))。

来源

2010-02-22 20:49:16

这就是我想做的事情。我会看看这个，看看它的作品了。谢谢 – Josh 2010-02-22 21:26:30

您这样做最好的办法就是让这一切相对，所以说，你有类似这样的标记：

<div class="container"> 
    <div class="overlay">Overlay content</div> 
    <button class="infoBtn">Click to show overlay</button> 
</div>

然后你可以找到覆盖此按钮realtively，就像这样：

$(function() { //equivalent to $(document).ready(function() { 
    $('.infoBtn').click(function() { 
    $(this).closest('.container').find('.overlay').toggleFade(400); 
    return false; 
    }); 
});

您可以进一步优化，例如.children('.overlay')如果叠加始终是容器的直接子。这是从当前按钮（this）开始，找到.container它使用.closest()，然后使用.find()找到其中的.overlay。通过这种方法，你有一个代码小位来处理所有的绑定，更容易维护:)

来源

2010-06-05 11:54:18

我必须复制此功能吗？ - jQuery

回答

相关问题