1

我正在创建一个导航栏，该导航栏将根据您所在网站的哪个页面打开（PHP 生成的“选定”类）

我正在尝试在 jQuery 中创建一个方法并将其附加到某些对象的 ID。我想我想让它尽可能地模块化——而且我正在尝试更多地了解 javascript 中的 OOP。

这是我的 HTML：

<div id="workNav">Work</a></div>
<div  id="workNavContents">
  <a class="selected" href="foo.html">Video/Film</a>
  <a class="" href="foo.html">Photography</a>
</div>
<div id="clientsNav"><a href="#">Clients</a></div>
<div id="clientsNavContents">
  <a href="foo.html">Agencies/Clients</a>
  <a href="foo.html">Directors/Photographers</a>
</div>

还有我的 Javascript：

var showSelected = new function(){
    if ($(this).children('.selected')){
        $(this).show();
    }
}

$('#workNavContents').showSelected = showSelected; 
$('#workNavContents').showSelected();

$('#clientNavContents').showSelected = showSelected; 
$('#clientNavContents').showSelected();

有些事情告诉我，我非常错过 jQuery 与 javascript 的关键点。任何帮助将非常感激。

谢谢！米

4

2 回答 2

2

$(...)每次调用它时都会返回一个新对象。

相反，您需要将您的方法添加到 jQuery 的原型中：

$.fn.showSelected = function() { ... };

然后可以通过所有 jQuery 对象访问它。

于 2013-03-07T01:41:01.127 回答
0

肯定少了一点理解。jQuery 让用户可以轻松地进行自定义。您需要做的就是访问 jQuery 的原型，它们通过$.fn. 一旦到位，就可以使用您的扩展程序。

请注意，我选择了淡入淡出，因此很明显它起作用了

var showSelected = function(){
  if ($(this).children('.selected')){
    $(this).hide().fadeIn(2000);
  }
}
$.fn.showSelected = showSelected;//you could also simply assign the function to this
$('#workNavContents').showSelected();

这是一个演示：http: //jsfiddle.net/mEgsX/

另请注意，您不需要使用new该功能。这创建了一个函数对象，并且是另一个完整的对话。

于 2013-03-07T01:45:25.133 回答