JQuery和点击功能

此代码无法按预期工作，我做错了什么？JQuery和点击功能

$(document).ready(function(){ 
    $("a.hide-para").click(function(){ 
    $('p').hide(); 
    $(this).html('Show Paragraphs').removeClass('hide-para').addClass('show-para'); 
    }); 
    $("a.show-para").click(function(){ 
    $('p').show(); 
    $(this).html('Hide Paragraphs').removeClass('show-para').addClass('hide-para'); 
    }); 
});

来源

2009-12-29 Keith Donegan

它在做什么而不是打算做什么？ – 2009-12-29 21:47:40

它不工作，因为你是动态添加/删除后级的元素被绑定到特定的元素/类组合。也就是说，在与该类别有任何关联之前（或者其他方式取决于您的默认设置），您正将点击事件添加到具有“show-para”类别的链接中

无论哪种情况， jQuery具有live函数来解决这个问题，只需将您的click处理程序更改为.live('click', function(){ })

来源

2009-12-29 21:48:29

好一个保罗，谢谢 – 2009-12-29 21:54:43

我退休后回答这一个;） – 2009-12-29 21:56:02

-2

尝试return false;单击处理程序

来源

2009-12-29 21:47:24 czarchaic

P.S.意图是什么？ – czarchaic 2009-12-29 21:48:03

他的点击可能只有一种方式，所以返回false不会做任何事情。 – Jage 2009-12-29 21:51:11

除非它跳到链接引用的页面... – czarchaic 2009-12-29 22:00:45

您在修改DOM时正在丢失绑定。要么停止改变的类名或绑定的事件使用live()：

$('a.hide-para').live('click', function() { ...

来源

2009-12-29 21:49:20

-1

我想这：

removeClass（ '隐藏 - 对'）addClass（ '秀 - 对'）

。是造成你的问题。

来源

2009-12-29 21:51:00 OneNerd

不，删除类不会删除绑定。问题是它*不*删除绑定并添加另一个。 – Guffa 2009-12-29 21:54:35

啊 - 我站好了。该死的，我讨厌它，当我错了:( – OneNerd 2009-12-29 21:57:33

-1

如果你的点击实际上是继链接，而不是做你的事件调用，你可以做到以下几点：

$("a.hide-para").click(function(evt){ 
    evt.preventDefault(); 
    // the rest is your code...

这样可以防止默认（链接如下动作）的发生......除了在IE6。

希望这会有所帮助。

来源

2009-12-29 21:53:21 cjstehno

假设你的类总是一开始就是“隐藏 - 对”，这应该工作：

$(document).ready(function() { 
    $("a.hide-para").click(function(){ 
     if($(this).hasClass('hide-para')){ 
      $('p').hide(); 
      $(this).html('Show Paragraphs').removeClass('hide-para').addClass('show-para'); 
     } else { 
      $('p').show(); 
      $(this).html('Hide Paragraphs').removeClass('show-para').addClass('hide-para'); 
     } 
    }); 
});

来源

2009-12-29 21:55:12 Jage

它将为第一个变化工作，但之后它只是做同样的改变一次。

事件在页面加载时应用一次，更改类不会删除并添加事件处理程序。

而不是使用隐蔽一个事件处理程序，一个用于展示，你可以使用一个做两件事：

$(function() { 
    $("a.hide-para, a.show-para").click(function(e) { 
    if ($(this).hasClass('hide-para')) { 
     $('p').hide(); 
     $(this).html('Show Paragraphs').removeClass('hide-para').addClass('show-para'); 
    } else { 
     $('p').show(); 
     $(this).html('Hide Paragraphs').removeClass('show-para').addClass('hide-para'); 
    } 
    e.preventDefault(); 
    }); 
});

此外，呼吁preventDefault防止了点击，即链接下面的默认操作。

来源

2009-12-29 22:00:52 Guffa

JQuery和点击功能

回答

相关问题