Toggle jQuery 实时事件中的问题

Posted 2023-05-08

【中文标题】Toggle jQuery 实时事件中的问题

【英文标题】：Toggle Problem in live event of jquery

【发布时间】：2011-01-11 03:36:40

【问题描述】：

我被这个困住了，谁能帮帮我...

这里是html

<tr class="appendvalue">
  <td colspan="2">
     <asp:DropDownList ID="ddlSource" runat="server"></asp:DropDownList>
     <asp:TextBox ID="txtSourceValue" runat="server" CssClass="hide" />
     <a href="#" class="t12">add static value</a>
  </td>

这里是jquery

$(document).ready(function() 
        $('.appendvalue > td > a').live("click", function(e) 
            e.preventDefault();
            $(this).prev().prev().toggle();
            $(this).prev().toggle();
            $(this).toggle(function()  $(this).text("select from dropdown"); , function()  $(this).text("add static value"); );
        );
    );

第一次点击后，它只切换锚文本而不切换下拉和文本框..

【参考方案1】：

试试这个：

$(document).ready(function() 
    $('.appendvalue > td > a').live("click", function(e) 
        e.preventDefault();
        var $this = $(this);
        $this.prevAll().toggle();
        $this.toggle(function()  $this.text("select from dropdown"); , function()  $this.text("add static value"); );
    );
);

【讨论】：

如果你要使用 $(this) 更多然后一次缓存它。变量 $this = $(this)。然后在其余的地方使用 $this，这意味着你没有重新创建 jQuery 对象。

@petersendidit 已经很晚了。我主张豁免权。 :) 很好，不知道为什么我在编写代码时没有看到。它已修复。谢谢老哥！

【参考方案2】：

.toggle() 确实是一种方便的点击事件方法，因此在同一元素的点击事件处理程序中使用 .toggle() 会出现问题。而是……

$(document).ready(function() 
    $('.appendvalue > td > a').live("click", function(e) 
        e.preventDefault();
        $(this).prevAll().toggle();
        if ($(this).parent().find("input").is(":hidden")) 
            $(this).text("add static value");
         else 
            $(this).text("select from dropdown");
        
    );
);